// Global styles for components

@import '@cnamts/design-tokens/dist/tokens';

.fade-enter-active,
.fade-leave-active {
	transition-duration: .15s;
	transition-property: opacity;
	transition-timing-function: ease;
}

.fade-enter,
.fade-leave-active {
	opacity: 0;
}

.v-application {
	// Warning rules: Change the main color when a warning is present
	.vd-warning-rules {
		&.success--text,
		.success--text {
			color: $vd-warning !important;
			caret-color: $vd-warning !important;
		}
	}

	// VDataTable: Custom styles
	.vd-data-table {
		border-top: thin solid rgba(0, 0, 0, .12);

		thead {
			background: $vd-am-blue-lighten-97;
		}

		table thead tr {
			white-space: nowrap;
		}

		&.row-clickable table tbody tr {
			cursor: pointer;
		}

		&.fixed-min-height {
			.v-data-table__wrapper {
				min-height: 540px;
			}
		}

		&.no-mobile-header {
			.v-data-table-header-mobile {
				display: none;
			}

			table {
				border-top: 2px solid #eee;
			}
		}
	}

	// Move fixed HeaderBar down when SkipLink is focused
	.vd-skip-link-container:focus-within + .vd-header-bar-container .v-app-bar--fixed {
		top: 28px;
	}
}