/* region Details tab basic defaults */
/**
 Please don't overwrite this per-system. This should just be the core
 CSS required for details tabs to work. If you want to customise this
 put it somewhere below
 */
.details_tab_wrapper {
	display: flex;
	flex-wrap: wrap;
}

.details_tab_wrapper > details {
	display: contents;
}

.details_tab_wrapper > details[open]::details-content {
	display: contents;
}

.details_tab_wrapper > details > summary {
	order: 0;
	cursor: pointer;
	display: block;
}

.details_tab_wrapper > details > summary::-webkit-details-marker {
	/* Don't put anything else in here this is just for Safari support */
	display: none;
}

.details_tab_wrapper > details[open]::before {
	/* Ensures there's always a "newline" */
	content: '';
	margin: 0;
	padding: 0;
	width: 100%;
	order: 1;
}

.details_tab_wrapper > details[open] > .details_tab_content {
	order: 3;
	flex-grow: 1;
	width: 100%;
	box-sizing: border-box;
}

.details_tab_wrapper > details[open] > .details_tab_content > :first-child {
	margin-top: 0;
}

.details_tab_wrapper > details[open] > .details_tab_content > :last-child {
	margin-bottom: 0;
}
/* endregion Details tab basic defaults */

/* region Custom system styles */
.details_tab_wrapper {
	justify-content: center;
}

.details_tab_wrapper > details > summary {
	padding: .5rem;
	margin: 0;
	line-height: 1;
	border-radius: 6px;
	background-color: #ddd;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	text-indent: 0;
}

.details_tab_wrapper > details > summary > :is(h2, h3) {
	margin: 0;
	padding: 0;
	font-size: 1em;
	display: inline;
	font-weight: normal;
}

.details_tab_wrapper > details[open] > summary {
	border: solid 1px #6699DD;
	color: #6699DD;
	background-color: #ffffff;
}

.details_tab_wrapper > details:not(:first-child) > summary {
	margin-left: .5rem;
}

.details_tab_wrapper > details:not([open]) > summary {
	background-color: #6699DD;
	color: #ffffff;
}
/* endregion Custom system styles */

/* region Custom style - NAV LIKE TABS */

.details_tab_wrapper.details_tab_wrapper_navstyle {
	justify-content: flex-start;
}

.details_tab_wrapper_navstyle_wrapper {
	margin-top:8px;
}

.details_tab_wrapper.details_tab_wrapper_navstyle::before {
	content: '';
	padding: 0;
	width: 100%;
	order: 1;
	border-top: 1px solid #ccc;
	margin-top: -1px;
	z-index: 0;
}

#wrapper.wrapper_risk .details_tab_wrapper.details_tab_wrapper_navstyle::before {
	/*border-top: 1.5px solid #27753b;*/
}

.details_tab_wrapper.details_tab_wrapper_navstyle > details[open]::before {
	display: none !important;
}

.details_tab_wrapper.details_tab_wrapper_navstyle > details > summary {
	font-family: Panton-SemiBold, Arial, sans-serif;
    font-size: 1.1em;

	background-color: #ddd;
	border: solid 1px #999;
	color: inherit;
	padding: 10px 30px;

	/* Trick to make the tab sit in front! */
	z-index: 1;
	border-bottom: none;
}

.details_tab_wrapper.details_tab_wrapper_navstyle > details[open] > summary {
	background-color: #ffffff;
	/*border-color: #000;*/
	/*color: #000;*/
}

.details_tab_wrapper.details_tab_wrapper_navstyle > details[open] > .details_tab_content {
	border: solid 1px #ccc;
	border-top: none;
	padding: 15px;
}

/* endregion Custom style - NAV LIKE TABS */