@use '../../../components/molecules/announcements';
@use '../../../base/functions' as *;

.announcement {
	&-bar {
		display: flex;
		justify-content: center;
		cursor: default;
		max-width: none;
		border-radius: 0;
		z-index: 2;
		border-color: var(--action);
		background-color: var(--action);

		&:hover,
		&:focus {
			border-color: var(--action);
			background-color: var(--action);
		}
	}

	&-message {
		font-family: var(--txt-body-family), monospace;
		color: var(--default);
	}

	&-link {
		display: inline-block;
		font-family: var(--txt-body-family), monospace;

		// these colors are "backwards" on purpose
		color: var(--default);

		&:hover,
		&:focus {
			// unofficial underline styles
			text-decoration: underline;
			color: var(--default);
		}

		&::before {
			position: relative;
		}

		&::after {
			display: none;
		}
	}
}