/* metamodels.css */

/* *
.mm-menu--position-bottom,
.mm-menu--position-left-front,
.mm-menu--position-right-front,
.mm-menu--position-top {
  transform: translate3d(0,0,0);
}
/* */

/* ... FE Filter ...
-----------------------------------------------*/
#mm_filter_popup a:visited {
	color: var(--button-default-color);
}
.fe_filter .mm-navbar {
  display: none;
}
.fe_filter form {
  margin-bottom: 2em;
}
.metamodels_frontendclearall a,
.hamburger-filter a,
.fe_filter .submit {
	background-color: var(--button-default-bg);
	color:            var(--button-default-color);
	font-size: 1em;
	padding-top: .4em;
	padding-bottom: .4em;
	padding-left: .5em;
	text-decoration: none;
  cursor: pointer;
	display: block;
}
.metamodels_frontendclearall a:hover,
.fe_filter .submit:hover,
.hamburger-filter a:hover,
.fe_listX > a:hover {
	background-color: var(--button-hover-bg);
	color:            var(--button-hover-color);
}
.fe_filter .top_buttons {
	display: flex;
	flex-direction: column;
	gap: .5em;
	background-color: white;
	color: var(--font-color-dark);
	margin-bottom: 1em;
	position: sticky;
	top: .5em;
	box-shadow: 0 calc(1em - 10px) 10px 0 white, 0 -.5em 0 0 white;
	border: 1px solid var(--border-color);
	padding: 1em;
	z-index: 1000;
}
.fe_filter .submit {
	width: 100%;
	font-family: inherit;
	line-height: inherit;
	text-align: left;
	border: none;
}
.mod_metamodels_frontendfilter {
  padding: .5em;
}
.fe_filter .ui-accordion-content {
  display: block;
	margin: -5px 0 1em;
	padding: 0;
	font-size: .8em;
	background-color: var(--menu-default-bg-l2);
	color:            var(--menu-default-color-l2);
	border: 1px solid var(--border-color);
	border-top-width: 0;
	min-width: 0;
	overflow: hidden;
}
.fe_filter fieldset {
	margin: 0;
	border: none;
	padding: 0;
}
.fe_filter fieldset > span,
.fe_filter fieldset label  {
	display: block;
}
.fe_filter fieldset label {
	padding: .25em .5em;
	cursor: pointer;
	background-color: var(--menu-default-bg-l2);
	color:            var(--menu-default-color-l2);
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.fe_filter fieldset label:hover {
  background-color: var(--menu-hover-bg-l2);
  color:            var(--menu-hover-color-l2);
}
.fe_filter fieldset input:checked + label  {
  background-color: var(--menu-active-bg-l2);
  color:            var(--menu-active-color-l2);
}
.fe_filter .checkbox {
  display: none;
}
/* ... FE Filter ... END
-----------------------------------------------*/



/* ... FE Filter Buttons ...
-----------------------------------------------*/
#filterContainer,
#selectionContainer {
	display: flex;
	flex-wrap: wrap;
	gap: .5em;
	margin-bottom: 1em;
}
#selectionContainer button {
  padding: 0;
	font-size: .7em;
	background-color: var(--brand-color-2-light);
	color:            white;
	cursor: pointer;
	border: none;
}
#selectionContainer button span {
	padding: .3em .4em;
}
#selectionContainer button:is(:hover, :active) {
	background-color: var(--brand-color-2);
	color:            white;
}
/* ... FE Filter Buttons ... END
-----------------------------------------------*/



/* ... FE List ...
-----------------------------------------------*/
.fe_list .item {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5em 1em;
	padding: 1em;
	margin-bottom: 1em;
	border: 1px solid var(--border-color);
}
.fe_list .item * {
	margin: 0;
}
.fe_list .title .label {
	display: none;
}
.fe_list .label {
	font-size: .8em;
	color: var(--label-color);
}
.fe_list .value {
	font-size: .9em;
}
.fe_list .title {
	grid-row: 1/2;
	grid-column: 1/-1;
	font-size: 1.4em;
  color: var(--brand-color-1);
}
.fe_list .details {
  grid-column: 1/-1;
	font-size: .9em;
}
.fe_list .details::after {
  content: '\2026';
}
/* ... FE List ... END
-----------------------------------------------*/



/* ... FE Details ...
-----------------------------------------------*/
.fe_details {
	--box-spacer: .6em;
}
.fe_details .item {
	display: grid;
	grid-template-columns: 17fr minmax(auto, 10fr);
	grid-template-areas:
		'top top'
		'left right'
	;
  /* grid-auto-rows: minmax(0, min-content); */
	gap: 0 1.5em;
	margin-bottom: 1em;
}
.fe_details .item > * {
	grid-column: 1/2;
  margin-bottom: 1.5em;
}
.field.is-text {
	display: flex;
	flex-wrap: wrap;
	gap: 0 .5em;
	align-content: flex-start;
}
.fe_details .field ul {
	margin-bottom: 0;
}
.fe_details .field .text {
	max-width: var(--max-length);
}
.fe_details .text :is(.label, .value) {
	/* display: inline-block; */
}
.fe_details .title {
	grid-row: 1/2;
	grid-column: 1/-1;
	font-size: 1.2em;
  color: var(--brand-color-1);
}
.fe_details .info_provider {
	grid-row-start: 2;
}
.fe_details .title .label {
	display: none;
}
.fe_details .label {
	font-size: .9em;
	color: var(--brand-color-1-dark);
}
.fe_details .value {
	font-size: .9em;
}
.fe_details .title .value {
	font-size: 1.3em;
}
.fe_details .back {
  grid-column: 1/-1;
	font-size: .9em;
}
.fe_details .address-box {
	grid-column: 2/-1;
  grid-row-start: 2;
  grid-row-end: 99;
	padding: .5em;
	border: 1px solid var(--border-color);
	justify-self: end;
	align-self: start;
}
.fe_details .address-box .label {
  display: none;
}
.fe_details .provider {
	font-weight: bold;
	margin-bottom: var(--box-spacer);
}
.fe_details .address {
	margin-top: var(--box-spacer);
}
.fe_details .postal_city {
	margin-bottom: var(--box-spacer);
}
/* ... FE Details ... END
-----------------------------------------------*/