/* General font styling */
.incidents-list .font-largest,
.scheduled-maintenances-container .font-largest {
	margin-top: 0;
	position: relative;
	display: block;
	font-family:
		MBCorpo Title,
		serif;
	font-size: 36px;
	font-weight: bold;
}
.font-regular {
	font-size: 16px;
}
.font-small,
small {
	font-size: 14px;
}
.updates {
	background-color: #282828;
	border: none !important;
}

@font-face {
	font-family: MBCorpo Text;
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	src: url(https://assets.oneweb.mercedes-benz.com/plugin/workbench/fonts/2.3.1/WOFF2/MBCorpoSText-Regular-Web.woff2)
		format('woff2');
}

@font-face {
	font-family: MBCorpo Text;
	font-weight: 700;
	font-style: normal;
	font-display: swap;
	src: url(https://assets.oneweb.mercedes-benz.com/plugin/workbench/fonts/2.3.1/WOFF2/MBCorpoSText-Bold-Web.woff2)
		format('woff2');
}

@font-face {
	font-family: MBCorpo Title;
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	src: url(https://assets.oneweb.mercedes-benz.com/plugin/workbench/fonts/2.3.1/WOFF2/MBCorpoATitleCond-Regular-Web.woff2)
		format('woff2');
}

/* General layout */
:root {
	--color-yellow: #facc00;
	--color-red: #d92121;
	--color-blue: #0078d6;
	--color-grey: #767676;
	--color-dark-grey: #282828;
	--color-border-on-contrast: #696969;
}

.modal:not([id^='subscribe-modal']) {
	color: black !important; /* fix broken modal on unsubscribe page */
}

body {
	font-family: 'MBCorpo Text', sans-serif;
}

/* Header */
header {
	padding-top: 60px !important;
	display: none;
}
header h1 {
	font-family: 'MBCorpo Title', serif;
}
.layout-content.status-index header {
	display: block;
}
.masthead-container.basic {
	max-width: 86vw !important;
}
@media screen and (min-width: 1953px) {
	.masthead-container.basic {
		max-width: 1680px !important;
	}
}

@media screen and (min-width: 650px) {
	.headings {
		width: 60%;
	}
	.layout-content.status-index header.masthead-container.basic {
		display: flex;
	}
	.masthead-container.basic {
		align-items: flex-end;
		justify-content: space-between;
	}
	.headings > p {
		margin-bottom: 0;
	}
}
.updates-dropdown-container {
	float: none !important;
	margin-top: 20px;
}

/* Status banner */
.layout-content.status.status-index .page-status.status-none {
	background-color: #198025;
}
.layout-content.status.status-index .page-status .status {
	top: 0;
	display: flex;
	align-items: center;
}
.status-icon {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	width: 35px;
	height: 35px;
	display: inline-block;
	margin-right: 0.5rem;
}
div.page-status {
	display: flex;
	align-items: center;
	color: white;
}

.page-status.status-minor {
	background-color: var(--color-yellow) !important;
}
.page-status.status-major,
.page-status.status-critical {
	background-color: var(--color-red) !important;
}
.page-status.status-maintenance {
	background-color: var(--color-blue) !important;
}

/* Unresolved incidents */
.unresolved-incidents .incident-title {
	text-shadow: none !important;
	display: flex;
	gap: 20px;
}

.unresolved-incidents .incident-title .status-icon {
	flex-shrink: 0;
	margin-right: 0;
}
.incident-notification-links {
	display: flex;
	flex-grow: 1;
	gap: 20px;
}
@media screen and (max-width: 650px) {
	.incident-notification-links {
		flex-direction: column;
		gap: 0;
	}
}
.unresolved-incidents .incident-title .actual-title {
	flex-grow: 1;
	word-break: break-word;
	font-weight: bold;
	font-size: 16px;
	width: 100% !important;
}
.unresolved-incidents .incident-title .subscribe {
	text-decoration: underline;
	text-transform: uppercase;
}
.unresolved-incidents .incident-title .subscribe:hover {
	text-decoration: none;
}

.unresolved-incidents .impact-none .incident-title {
	background-color: var(--color-grey) !important;
}

.unresolved-incidents .impact-minor .incident-title {
	background-color: var(--color-yellow) !important;
}
.unresolved-incidents .impact-minor .incident-title a {
	color: black !important;
}

.unresolved-incidents .impact-major .incident-title,
.unresolved-incidents .impact-critical .incident-title {
	background-color: var(--color-red) !important;
}

.unresolved-incidents .impact-maintenance .incident-title {
	background-color: var(--color-blue) !important;
}

/* Components section */
.components-container {
	display: flex;
	flex-wrap: wrap;
}
.component-container {
	border-color: black !important;
	border-width: 1px !important;
	background-color: #282828 !important;
	overflow: hidden;
}
@media screen and (min-width: 650px) {
	.component-container {
		flex-basis: 50%;
	}
}

.component-container .icon-indicator {
	float: none !important;
	position: relative !important;
	top: 0 !important;
	flex-shrink: 0;
}
.component-inner-container {
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	align-items: center;
}
.component-container .name {
	margin-right: auto;
	max-width: none !important;
}
.uptime-90-days-wrapper {
	display: none;
}
.component-container .tooltip-base.tool.tooltipstered {
	display: none !important;
}
.layout-content.status.status-index
	.components-section
	.components-container.one-column
	.component-container,
.layout-content.status.status-index
	.components-section
	.components-container.one-column
	.component-container:nth-child(n) {
	border-radius: 0 !important;
	-webkit-border-radius: 0 !important;
}
.component-container.is-group {
	padding: 1.1rem 1.25rem 1rem !important;
}

@media screen and (max-width: 650px) {
	.component-container.is-group {
		padding: 0.85rem 1rem 0.75rem !important;
	}
}

.component-container .group-parent-indicator:focus {
	box-shadow: none !important;
}
.component-container .group-parent-indicator::before {
	margin-left: 3px;
}
.component-container .group-parent-indicator:focus-visible::before {
	outline: var(--color-blue) auto 2px;
}
.tool {
	display: block !important;
}
.component-status {
	display: none !important;
}

/* Legend */
.component-statuses-legend {
	display: flex !important;
	justify-content: space-around;
	color: #999;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	padding-top: 1rem;
	padding-bottom: 1rem;
}
@media screen and (max-width: 650px) {
	.component-statuses-legend {
		flex-direction: column;
		gap: 1rem;
	}
}
.legend-item {
	display: flex !important;
	align-items: center;
	margin: 0 !important;
}
.component-statuses-legend .breaker {
	display: none !important;
}

/* Scheduled maintenance */
.scheduled-maintenance .incident-title {
	border-color: #666 !important;
}

/* Incident history */
.incidents-list > div:first-of-type::before {
	content: 'You can use the notifications listed below to track any product problems that may have occurred in the past.';
	margin-bottom: 3rem;
	display: block;
}
@media screen and (min-width: 650px) {
	.incidents-list > div:first-of-type::before {
		max-width: 60%;
	}
}
.incidents-list .incident-title a {
	color: var(--color-blue) !important;
}
.incidents-list .incident-container {
	background-color: var(--color-dark-grey);
	padding: 1rem;
}
.incidents-list .incident-container br {
	display: none;
}
.incidents-list .incident-container .update {
	padding-left: 3rem;
	position: relative;
	margin: 1rem 0 !important;
}
.incidents-list .incident-container .update::before {
	content: '';
	position: absolute;
	left: 30px;
	top: 7px;
	width: 8px;
	height: 8px;
	background: var(--color-blue);
}
.incidents-list .incident-container .incident-title {
	font-weight: bold;
	font-size: 18px;
	display: flex;
	align-items: center;
}
.incidents-list .incident-container .postmortem a {
	color: white;
	text-decoration: underline;
}
.incidents-list .incident-container .postmortem a:hover {
	text-decoration: none;
}

.incidents-list .status-icon {
	width: 22px;
	height: 22px;
}
.incidents-list .status-day.no-incidents {
	border-bottom: 1px solid white;
}
.incidents-list .status-day.no-incidents > * {
	display: inline-block;
}
.incidents-list .status-day.no-incidents .date {
	border-bottom-width: 0 !important;
	min-width: 120px;
	margin-bottom: 0 !important;
}
.incidents-list .status-day.no-incidents > p {
	padding-left: 1rem;
}
.incidents-list .status-day .date {
	border-width: 0 !important;
}
.incidents-list .status-day {
	border-bottom: 1px solid #666 !important;
	margin-top: 18px !important;
	padding-bottom: 18px;
}

/* Footer */
.page-footer {
	margin-top: 0;
	margin-bottom: 0;
	padding: 70px 0 35px 0;
	border-top-width: 0 !important;
}
.page-footer span {
	float: none;
}
.history-footer-link {
	display: none;
}
.page-footer .powered-by a {
	text-decoration: underline;
}
.page-footer .powered-by a:hover {
	text-decoration: none;
	color: #aaaaaa !important;
}

/* Incident page */
.container {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
	margin-top: 0 !important;
	max-width: 86vw;
}
@media screen and (min-width: 1953px) {
	.container {
		max-width: 1680px !important;
	}
}

body.status.incident .incident-name.impact-minor {
	background-color: var(--color-yellow) !important;
	color: black !important;
}

body.status.incident .incident-name.impact-none {
	background-color: var(--color-grey) !important;
}

body.status.incident .incident-name.impact-major,
body.status.incident .incident-name.impact-critical {
	background-color: var(--color-red) !important;
}

body.status.incident .incident-name.impact-maintenance {
	background-color: var(--color-blue) !important;
}

body.status.incident .incident-name,
body.status.incident .subheader {
	word-break: break-word;
	font-weight: bold !important;
	font-size: 16px !important;
	text-align: start;
	color: white !important;
}
body.status.incident .subheader {
	margin-top: 1rem;
}

body.status.incident .subheader a {
	color: white !important;
	text-decoration: underline;
}

body.status.incident .subheader a:hover {
	text-decoration: none;
}

body.status.incident .incident-name {
	padding: 0 1rem;
}

body.status.incident .components-affected {
	color: white;
	border-color: white !important;
	border-radius: 0 !important;
}

/* Component selection page and subscription edit page*/
.manage-subscriptions .custom-header-container,
.status.incident .custom-header-container {
	padding-bottom: 70px !important;
	margin-bottom: 0 !important;
}

body.status.component_selection .heading .title,
body.status.edit .heading .title {
	font-size: 36px;
	font-weight: bold;
	line-height: 48px;
	margin-bottom: 1rem;
}

body.status.component_selection .grouped-items-selector,
body.status.edit .grouped-items-selector {
	margin-top: 1rem;
	border: none;
}

body.status.component_selection .grouped-items-selector .grouped-item,
body.status.edit .grouped-items-selector .grouped-item {
	border: 2px solid black !important;
	background-color: #282828;
	padding: 1rem;
}

body.status.component_selection
	.grouped-items-selector
	.group-parent
	.grouped-item,
body.status.edit .grouped-items-selector .group-parent .grouped-item {
	border: none !important;
}

body.status.component_selection
	.grouped-items-selector
	.grouped-item
	label
	span,
body.status.edit .grouped-items-selector .grouped-item label span {
	padding-top: 0;
	overflow: hidden;
	height: 24px;
}

body.status.component_selection
	.grouped-items-selector
	.grouped-item
	label
	.grouped-item-label,
body.status.edit
	.grouped-items-selector
	.grouped-item
	label
	.grouped-item-label {
	align-items: center;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	max-width: 100%;
	display: inline-block;
}

body.status.component_selection .grouped-items-selector .grouped-item label,
body.status.edit .grouped-items-selector .grouped-item label {
	gap: 0.5rem;
	font-family: 'MBCorpo Text', sans-serif;
}

body.status.component_selection
	.grouped-items-selector
	.grouped-item
	.grouped-item-label
	span,
body.status.edit
	.grouped-items-selector
	.grouped-item
	.grouped-item-label
	span {
	font-size: 16px;
}

body.status.component_selection
	.grouped-items-selector
	.grouped-item
	.grouped-item-label
	i,
body.status.edit .grouped-items-selector .grouped-item .grouped-item-label i {
	width: 18px;
	height: 18px;
	margin-right: 10px;
	margin-left: 8px;
	color: white;
}

body.status.component_selection .form-actions,
body.status.edit .form-actions {
	gap: 1rem;
}

#show-updates-dropdown,
body.status.incident .subscribe-button,
body.status.component_selection .form-actions .cancel-btn,
body.status.component_selection .form-actions .flat-button,
body.status.edit .form-actions .cancel-btn,
body.status.edit .form-actions .flat-button {
	border-radius: 2px;
	text-shadow: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	font-size: 14px;
	line-height: 14px;
	letter-spacing: 0.05em;
	font-weight: 700;
	padding: 15px 31px;
	text-transform: lowercase;
}

#show-updates-dropdown,
body.status.incident .subscribe-button,
body.status.component_selection .form-actions .flat-button,
body.status.edit .form-actions .flat-button {
	background-color: var(--color-blue);
	border: 1px solid var(--color-blue) !important;
	color: white;
}

body.status.component_selection .form-actions .cancel-btn,
body.status.edit .form-actions .cancel-btn {
	background-color: transparent;
	border: 1px solid var(--color-border-on-contrast) !important;
	color: white;
}

#show-updates-dropdown::first-letter,
body.status.incident .subscribe-button::first-letter,
body.status.component_selection .form-actions .flat-button::first-letter,
body.status.edit .form-actions .flat-button::first-letter,
body.status.component_selection .form-actions .cancel-btn::first-letter,
body.status.edit .form-actions .cancel-btn::first-letter {
	text-transform: uppercase;
}

body.status.edit .subscriber-heading .border {
	border-radius: 0;
}

/* Custom status banner icons */
.icon-all-systems-operational {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M16 2.667C8.636 2.667 2.667 8.637 2.667 16c0 7.364 5.97 13.333 13.333 13.333 7.364 0 13.333-5.97 13.333-13.333A13.333 13.333 0 0 0 16 2.667zm-2.533 19.63-4.436-5.51 1.557-1.254 2.97 3.691 7.894-8.659 1.481 1.348-9.466 10.384z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E");
}
.icon-notification {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='18'%3E%3Cpath fill='white' fill-rule='nonzero' d='M21.07 16.479 11.854 1.4a1 1 0 0 0-1.708 0L.93 16.479A1 1 0 0 0 1.783 18h18.434a1 1 0 0 0 .853-1.521ZM10 5h2v7h-2V5Zm1 11.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Z'/%3E%3C/svg%3E");
}
.icon-notification-black {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='18'%3E%3Cpath fill='black' fill-rule='nonzero' d='M21.07 16.479 11.854 1.4a1 1 0 0 0-1.708 0L.93 16.479A1 1 0 0 0 1.783 18h18.434a1 1 0 0 0 .853-1.521ZM10 5h2v7h-2V5Zm1 11.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Z'/%3E%3C/svg%3E");
}
.icon-notification-blue {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='18'%3E%3Cpath fill='%23008DFC' fill-rule='nonzero' d='M21.07 16.479 11.854 1.4a1 1 0 0 0-1.708 0L.93 16.479A1 1 0 0 0 1.783 18h18.434a1 1 0 0 0 .853-1.521ZM10 5h2v7h-2V5Zm1 11.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Z'/%3E%3C/svg%3E");
}
.icon-maintenance-white {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='white' fill-rule='nonzero' d='M10 0a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S0 15.523 0 10 4.477 0 10 0Zm5.154 3.432a2.5 2.5 0 0 0-3.237 3.237l-5.248 5.248a2.5 2.5 0 0 0-3.237 3.237l1.618-1.618 1.414 1.414-1.618 1.618a2.5 2.5 0 0 0 3.237-3.237l5.248-5.248a2.5 2.5 0 0 0 3.237-3.237L14.95 6.464 13.536 5.05Z'/%3E%3C/svg%3E");
}

/* Custom legend icons */
.fa {
	width: 20px;
	height: 20px;
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.legend-item .fa {
	width: 16px;
	height: 16px;
}

.icon-operational,
.fa-check {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='%23198025' fill-rule='nonzero' d='M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10A10 10 0 0 0 10 0ZM8.1 14.723 4.773 10.59l1.168-.94 2.227 2.768 5.921-6.494L15.2 6.935l-7.1 7.788Z'/%3E%3C/svg%3E");
}
.fa-check::before {
	content: '';
}

.icon-partial-outage,
.fa-exclamation-triangle {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='%23FACC00' fill-rule='nonzero' d='M10 0a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S0 15.523 0 10 4.477 0 10 0Zm0 13a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Zm1.007-9h-2v7.305h2V4Z'/%3E%3C/svg%3E");
}
.fa-exclamation-triangle::before {
	content: '';
}

.icon-major-outage,
.fa-times {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='%23D92121' fill-rule='nonzero' d='M10 0a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S0 15.523 0 10 4.477 0 10 0Zm3.181 5.758L10 8.94 6.819 5.758l-1.061 1.06L8.94 10l-3.182 3.181 1.06 1.061L10 11.06l3.181 3.182 1.061-1.06L11.06 10l3.182-3.181-1.06-1.061Z'/%3E%3C/svg%3E");
}
.fa-times::before {
	content: '';
}

.icon-maintenance,
.fa-wrench {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='%23008DFC' fill-rule='nonzero' d='M10 0a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S0 15.523 0 10 4.477 0 10 0Zm5.154 3.432a2.5 2.5 0 0 0-3.237 3.237l-5.248 5.248a2.5 2.5 0 0 0-3.237 3.237l1.618-1.618 1.414 1.414-1.618 1.618a2.5 2.5 0 0 0 3.237-3.237l5.248-5.248a2.5 2.5 0 0 0 3.237-3.237L14.95 6.464 13.536 5.05Z'/%3E%3C/svg%3E");
}
.fa-wrench::before {
	content: '';
}

.icon-degraded-performance,
.fa-minus-square {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath fill='%23767676' fill-rule='nonzero' d='M10 0a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S0 15.523 0 10 4.477 0 10 0Zm5.25 9.25H4.75v1.5h10.5v-1.5Z'/%3E%3C/svg%3E");
}
.fa-minus-square::before {
	content: '';
}

/* Custom incident history icons */
.icon-investigating {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cg fill='%23333' fill-rule='nonzero'%3E%3Cpath d='M8.236 1.333a4.333 4.333 0 1 1 0 8.667 4.333 4.333 0 0 1 0-8.667m0-1a5.333 5.333 0 1 0 0 10.667 5.333 5.333 0 0 0 0-10.667Z'/%3E%3Cpath d='m1.845 13.471 3.986-3.986L4.417 8.07.431 12.057a.333.333 0 0 0 0 .472l.942.942a.333.333 0 0 0 .472 0Z'/%3E%3C/g%3E%3C/svg%3E");
}
.icon-resolved {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='12'%3E%3Cpath fill='%23333' fill-rule='evenodd' d='M4.587 11.623.333 6.34l1.495-1.202 2.848 3.54 7.57-8.305 1.42 1.293z'/%3E%3C/svg%3E");
}

/* History page*/
.impact-critical.incident-title,
.impact-major.incident-title {
	color: var(--color-red) !important;
}