/*
//////////////////////////////////////////////////////////////////////////////////
// 																				//
// COPYRIGHT:  NICK VAN KOLLENBURG							 					//
// nickvankollenburg@gmail.com													//
// 																				//
//////////////////////////////////////////////////////////////////////////////////
*/

/** Gradients for easy use */
div.panel {
	width: 100%;
	
	border-radius: var(--border-radius);
	background: var(--color-mybms-panel-large-gradient);
}

/** White alpha bg */
div.alpha-box {
	border-radius: var(--border-radius);
	background: var(--color-alpha-background-box);
}
div.alpha-box-dark {
	border-radius: var(--border-radius);
	background: var(--color-alpha-background-box-dark);
}
div.alpha-box-large {
	border-radius: var(--border-radius);
	background: var(--color-alpha-background-box-large);
}
div.alpha-box-padding {
	padding: 10px;
}

/* Tag Display
-------------------------------------------------------------- */
ul.mybms-tags {
	padding: 0px;
	margin: 0px;
	margin-left: 15px;
	
	list-style: decimal;
}
ul.mybms-tags ul {
	padding: 0px;
	margin: 0px;
	margin-left: 15px;
	
	list-style: square;
}


/* Lines
-------------------------------------------------------------- */
div.mybms-line {
	display: block;
	
	width: 100%;
	height: 1px;
	
	border-top: 1px solid transparent;
	border-image: var(--color-mybms-border-gradient);
}
div.mybms-line-large {
	display: block;
	
	width: 100%;
	height: 1px;
	
	border-top: 1px solid transparent;
	border-image: var(--color-mybms-border-large-gradient);
}
div.mybms-line-vertical {
	display: block;
	
	width: 1px;
	height: 100%;
	
	border-top: 1px solid transparent;
	border-image: var(--color-mybms-border-vertical-gradient);
}


/* Form
-------------------------------------------------------------- */
div.mybms-form {
	
}
div.mybms-form p:not(.editor-app p):first-of-type {
	color: rgb(var(--color-mybms));
	font-weight: var(--font-weight-bold);
	padding-bottom: 5px;
	
	display: inline-block;
	width: auto;
}
div.mybms-form p{
	text-shadow: var(--text-shadow-ultra-light);
}


/* Grid
-------------------------------------------------------------- */
@media screen and (min-width:  0px)  {
	body.mybms-layout {
		--mybms-grid-column-count-1: 1;
		--mybms-grid-column-count-2: 1;
		--mybms-grid-column-count-3: 1;
		--mybms-grid-column-count-4: 1;
	}
}

@media screen and (min-width:  768px)  {
}

@media screen and (min-width: 1400px) {
	body.mybms-layout {
		--mybms-grid-column-count-2: 2;
		--mybms-grid-column-count-3: 2;
		--mybms-grid-column-count-4: 2;
	}
}

@media screen and (min-width: 1500px) {
	body.mybms-layout {
		--mybms-grid-column-count-3: 3;
		--mybms-grid-column-count-4: 3;
	}
}

@media screen and (min-width: 1700px) {
	body.mybms-layout {
		--mybms-grid-column-count-4: 4;
	}
}

@media screen and (min-width:  2200px) {
}
div.mybms-grid-1 {
	--mybms-grid-column-count: var(--mybms-grid-column-count-1);
}
div.mybms-grid-2 {
	--mybms-grid-column-count: var(--mybms-grid-column-count-2);
}
div.mybms-grid-3 {
	--mybms-grid-column-count: var(--mybms-grid-column-count-3);
}
div.mybms-grid-4 {
	--mybms-grid-column-count: var(--mybms-grid-column-count-4);
}
div.mybms-grid {
	position: relative;
	
	display: grid;
	gap: 15px;
	
	grid-template-columns: repeat(var(--mybms-grid-column-count), minmax(0, 1fr));
}
div.mybms-grid div.mybms-grid-item {
	text-align: left;
	min-width: 0;
}
div.grid-column-content {
	white-space: normal;
	overflow-wrap: normal;
	word-break: normal;
}


/* Layover Screen
-------------------------------------------------------------- */
@media screen and (min-width:  0px)  {
	div.mybms-screen {
		max-width: 90%;
	}
	div.mybms-screen-panels {
		max-height: 370px;
	}
	ul.mybms-screen-list li .check-label {
		width: 160px;
	}
	div.mybms-screen-large ul.mybms-screen-list li .check-label {
		width: 200px;
	}
}
@media screen and (min-width: 1100px) {
	div.mybms-screen {
		max-width: 80%;
	}
	div.mybms-screen-panels {
		max-height: 500px;
	}
	ul.mybms-screen-list li .check-label {
		width: auto;
		max-width: 175px;
	}
	div.mybms-screen-large ul.mybms-screen-list li .check-label {
		max-width: 300px;
	}
}
div.mybms-screen {
	display: inline-block;
	background: #fff;
	box-shadow:  5px 5px 16px -8px #868686;
	
	border: 1px solid #ccc;
	border-radius:  var(--border-radius);
	
	position: absolute;
	z-index: 99951;
	
	left: -2500px;
	top: -2500px;
}
div.mybms-screen div.mybms-screen-background {
	background: var(--color-mybms-panel-large-gradient);
}
div.mybms-screen div.mybms-screen-flex {
	display: flex;
	justify-content: space-between;
	align-items: start;
}
div.mybms-screen div.mybms-screen-buttons {
	display: flex;
	justify-content: start;
	align-items: start;
	
	padding: 10px;
	padding-top: 0;
}
div.mybms-screen div.mybms-screen-panels {
	
	display: flex;
	flex-wrap: wrap;
	justify-content: start;
	align-items: start;
	
	width: 100%;
	
	overflow-y: scroll;
	overflow-x: hidden;
	
	gap: 12px;
	
	margin: 10px;
}
div.mybms-screen div.mybms-screen-panels div.mybms-screen-panel {
}
div.mybms-screen-close {
	cursor: pointer;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	user-select: none;
	
	background-color: rgb(var(--color-secondary));
	background-image: url(../../images/icons/buttons/close.svg);
	background-size: 70%;
	background-position: 3px 3px;
	background-repeat: no-repeat;
	
	border-radius: var(--border-radius);
	
	margin-top: 7px;
	margin-right: 7px;
	
	width: 21px;
	height: 21px;
	min-width: 21px;
	min-height: 21px;
	
	transition:
		transform 0.2s ease-in-out,
		opacity 0.2s ease-in-out,
		box-shadow 0.2s ease-in-out;
}
div.mybms-screen-close:hover {
	transform: scale(1.02);
	opacity: .7;
	box-shadow: 0 0px 10px #999;
}

/** Checkbox panel list */
ul.mybms-screen-list {
	padding: 0px;
	margin: 0px;
	
}
ul.mybms-screen-list li {
	list-style: none;
}
ul.mybms-screen-list li .check-box-field {
	width: 13px;
	height: 13px;
}
ul.mybms-screen-list li .check-label {
	font-size: 12px;
	
	display: block;
	overflow: hidden;
	
	white-space: nowrap;
	text-overflow: ellipsis;
}
div.mybms-screen-large ul.mybms-screen-list li .check-label {
	font-size: 14px;
}
ul.mybms-screen-list div.mybms-screen-list-item {

}


/* Select Box
-------------------------------------------------------------- */
@media screen and (min-width: 0px) {
	body.mybms-layout {
		--mybms-box-select-h2-font-size: 16px;
		--mybms-box-select-h2-margin: 5px;
	}
	div.mybms-box-select-padding h2 {
		margin-top: -5px;
	}
}
@media screen and (min-width: 1100px) {
	body.mybms-layout {
		--mybms-box-select-h2-font-size: 22px;
		--mybms-box-select-h2-margin: 5px;
	}
	div.mybms-box-select-padding h2 {
		margin-top: 0px;
	}
}

@media screen and (min-width: 1500px) {
	body.mybms-layout {
		--mybms-box-select-h2-font-size: 22px;
	}
}

div.mybms-box,
div.mybms-box-select {
	cursor: pointer;
	
	background: var(--color-alpha-background-dark);
	border: 1px solid rgb(var(--color-mybms-light));
	border-radius: var(--border-radius);
	
	width: 100%;
	transition: opacity 0.2s ease-in-out;
}
div.mybms-box-select-selected {
	border: 1px solid rgb(var(--color-secondary));
}
div.mybms-box-select:hover {
	opacity: 0.5;
}
div.mybms-box-select-padding {
	padding: 10px 15px 15px 15px;
}
div.mybms-box-select-small div.mybms-box-select-padding {
	padding: 0px 10px 0px 10px;
}
div.mybms-box-select-padding .h2 {
	font-size: var(--mybms-box-select-h2-font-size);
	color: rgb(var(--color-secondary));
	
	margin-bottom: var(--mybms-box-select-h2-margin);
	
	transition:
	text-shadow 0.2s ease-in-out,
	transform 0.2s ease-in-out;
}
div.mybms-box-select:hover div.mybms-box-select-padding .h2 {
	transform: scale(1.02);
	text-shadow: var(--text-shadow);
}
div.mybms-box-select-padding p {
	font-size: 13px;
	transition: transform 0.2s ease-in-out;
}
div.mybms-box-select:hover div.mybms-box-select-padding p {
	transform: scale(1.02);
}


/* Tab Switch
-------------------------------------------------------------- */
div.mybms-tab-switch {
	display: flex;
	width: 100%;
}
div.mybms-tab-switch-item {
	cursor: pointer;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	user-select: none;

	flex: 1;
	box-sizing: border-box;
	text-align: center;

	font-family: var(--button-font);
	font-size: var(--button-font-size);
	font-weight: var(--button-font-weight);
	letter-spacing: var(--button-letter-spacing);

	text-decoration: none;
	text-transform: uppercase;

	color: rgb(var(--button-color));
	background-color: rgb(var(--button-color-background));

	border: 0;
	padding: 8px 20px;

	transition:
		opacity 0.2s ease-in-out;
}
div.mybms-tab-switch > div.mybms-tab-switch-item:first-child {
	border-top-left-radius: var(--button-border-radius);
	border-bottom-left-radius: var(--button-border-radius);
}

div.mybms-tab-switch > div.mybms-tab-switch-item:last-child {
	border-top-right-radius: var(--button-border-radius);
	border-bottom-right-radius: var(--button-border-radius);
}
div.mybms-tab-switch-item-active {
	background-color: rgb(var(--button-color-background-submit));
}
div.mybms-tab-switch-item:hover {
	opacity: 0.5;
}
div.mybms-tab-switch-item span {
	display: block;
	transition:
		transform 0.2s ease-in-out,
		box-shadow 0.2s ease-in-out;
}
div.mybms-tab-switch-item:hover span {
	text-shadow: 0 0px 10px var(--color-accent);
}


/* Panel display
-------------------------------------------------------------- */
div.mybms-panel {
	border-radius: var(--panel-border-radius);
	
	background: var(--color-mybms-panel-gradient);

	display: inline-block;
	padding: 7px 7px 0px 7px;
	
	width: calc(100% - 14px);
}
div.mybms-panel-shadow {
	box-shadow: var(--shadow-light);
}
div.mybms-panel-opacity {
	opacity: 0.8;
}
div.mybms-panel-opacity:hover {
	opacity: 1;
}

/** Gradient on main content or sidebar */
div.mybms-page div.mybms-page-content div.mybms-panel {
	background: var(--color-mybms-panel-large-gradient);
}
div.mybms-panel-sidebar {
	background: var(--color-mybms-panel-sidebar-gradient);
}

/** Header */
div.mybms-panel div.mybms-panel-header {
	font-weight: var(--font-weight-bold);
	border-bottom: 1px solid transparent;
}
div.mybms-panel div.mybms-panel-header-inner {
	background-color: var(--color-alpha-background);
	border-radius: var(--border-radius);
	
	display: block;
	padding: 5px 5px 5px 5px;
	margin-bottom: 7px;
	
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	
}
div.mybms-panel div.mybms-panel-header-inner div {
	font-family: 'VagRounded';
	color: rgb(var(--color-secondary) / 0.7);
	
	transition:
		font-weight 0.2s ease-in-out,
		text-shadow 0.2s ease-in-out,
		color 0.2s ease-in-out,
		transform 0.2s ease-in-out;
}
div.mybms-panel-font-large div.mybms-panel-header-inner {
	font-size: 15px;
}
div.mybms-panel-color div.mybms-panel-header-inner div {
	color: rgb(var(--color-mybms));
	text-shadow: var(--text-shadow-mybms-light);
}
div.mybms-panel div.mybms-panel-header:hover div.mybms-panel-header-inner div.mybms-panel-header-title {
	font-weight: var(--font-weight-bold);
	text-shadow: var(--text-shadow);
	color: rgb(var(--color-secondary) / 1);
	transform: scale(1.02);
}
div.mybms-panel-color div.mybms-panel-header:hover div.mybms-panel-header-inner div.mybms-panel-header-title {
	text-shadow: var(--text-shadow-light);
	color: rgb(var(--color-secondary) / 0.7);
}
div.mybms-panel div.mybms-panel-header div.mybms-panel-header-inner div.mybms-panel-header-title::before {
	content: "::";
	display: inline-block;
	width: 13px;
	position: relative;
	top: -1px;
}
div.mybms-panel div.mybms-panel-header-inner span {
	color: rgb(var(--color-mybms));
}
div.mybms-panel-color div.mybms-panel-header-inner {
	color: rgb(var(--color-mybms));
}
div.mybms-panel-color div.mybms-panel-header-inner span {
	color: rgb(var(--color-text));
}

/** Title on main content */
div.mybms-page div.mybms-page-content  div.mybms-panel-large div.mybms-panel-content-inner div.mybms-panel-link:hover {
	font-weight: var(--font-weight-bold);
	text-shadow: var(--text-shadow);
	transform: scale(1.005);
	opacity: 0.8;
}

/** Header arrow */
div.mybms-panel div.mybms-panel-header-arrow {
	display: inline-block;
	
}
div.mybms-panel div.mybms-panel-header-arrow span {
	display: inline-block;
	
	width: 15px;
	height: 15px;
	
	background-repeat: no-repeat;
	background-size: contain;
	
	opacity: 0.5;
	
	transition:
		opacity 0.2s ease-in-out;
}
/** Hide both arrows on start because of a weird positioning bug */
div.mybms-panel div.mybms-panel-header-arrow span.mybms-panel-header-arrow-up {
	background-image: var(--arrow-up);
	display: none;
}
div.mybms-panel div.mybms-panel-header-arrow span.mybms-panel-header-arrow-down {
	background-image: var(--arrow-down);
	display: none;
}
div.mybms-panel div.mybms-panel-header:hover div.mybms-panel-header-arrow span {
	opacity: 1;
}

/** Content */
div.mybms-panel div.mybms-panel-content-spacer {
	height: 8px;
}
div.mybms-panel div.mybms-panel-content-inner {
	width: calc(100% - 5px);
	border-radius: var(--border-radius);
	margin: 2px 0px 10px 2px;
}
div.mybms-panel div.mybms-panel-content-inner .button {
	width: 100%;
}
div.mybms-panel-content-inner-overflow {
	overflow-y: auto;
	overflow-x: hidden;
}

/** Panel list */
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-list {
	color: rgb(var(--color-secondary) / 1);
	font-weight: var(--font-weight-normal);
	
	padding: 7px 0px 7px 5px;
	
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	gap: 10px;
	
	flex-wrap: nowrap;
	white-space: nowrap;
}
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-list span:nth-child(1) {
	display: inline-block;
}
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-listarrow span:nth-child(1)::before {
	content: "";
	
	background-image: var(--arrow-right-mybms);
	background-repeat: no-repeat;
	background-size: contain;
	
	position: relative;
	top: 2px;
	margin-right: 5px;
	
	display: inline-block;
	
	width: 15px;
	height: 15px;
	
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-list span:nth-child(2) {
	font-weight: var(--font-weight-bold);
	color: rgb(var(--color-text));
	
	display: inline-block;
	padding-right: 15px;
	
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
div.mybms-panel div.mybms-panel-content-inner div.list-selected {
	color: rgb(var(--color-mybms));
	font-weight: var(--font-weight-bold);
}

/** Links */
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-link {
	cursor: pointer;
	
	background-color: var(--color-alpha-background);
	border-radius: var(--border-radius);
	
	margin-bottom: 7px;
	
	transition:
		font-weight 0.2s ease-in-out,
		text-shadow 0.2s ease-in-out,
		opacity 0.2s ease-in-out,
		transform 0.2s ease-in-out;
}
div.mybms-panel div.mybms-panel-content-inner div.mybms-panel-link:hover {
	font-weight: var(--font-weight-bold);
	text-shadow: var(--text-shadow);
	transform: scale(1.02);
	opacity: 0.8;
}

/** Panel resize */
div.mybms-panel-slide div.mybms-panel-content {
	overflow: hidden;
	transition: height 0.2s ease-in-out;
}
div.mybms-panel-slide div.mybms-panel-header {
	cursor: pointer;
}
div.mybms-panel.mybms-panel-slide-open div.mybms-panel-header {
	border-image: var(--color-mybms-border-gradient);
}
div.mybms-panel-large.mybms-panel-slide-open div.mybms-panel-header {
	border-image: var(--color-mybms-border-large-gradient);
}
div.mybms-panel-slide.mybms-panel-slide-closed div.mybms-panel-content {
	height: 0;
}




/* Page Listing
-------------------------------------------------------------- */
div.mybms-page-listing {
}

/** Input */
div.mybms-page-listing p.page-list-input {
	cursor: pointer;

	font-family: 'VagRounded';
	font-size: 12px;
	font-weight: var(--font-weight-bold);
	
	color: rgb(var(--color-mybms));
	background-color: var(--color-input-background);
	
	border: var(--input-border-dark);
	border-radius: var(--input-border-radius);
	
	box-shadow: var(--input-box-shadow);
	
	display: inline-block;
	padding: 3px;
	
	opacity: var(--input-opacity);
	
	transition: all 0.3s ease-in-out;
}
div.mybms-page-listing p.page-list-input:not(.page-list-deactive):hover {
	opacity: var(--input-opacity-hover);
	color: rgb(var(--color-input-text-hover));
	background-color: var(--color-input-background-hover);
	transform: scale(1.1);
}
div.mybms-page-listing p.page-list-input span {
	display: inline-block;
	
	text-align: center;
	
	padding: 0px 5px;
	height: 15px;
}

/** Arrows */
div.mybms-page-listing span.page-list-first,
div.mybms-page-listing span.page-list-prev,
div.mybms-page-listing span.page-list-next,
div.mybms-page-listing span.page-list-last {
	cursor: pointer;
	padding: 4px;
}
div.mybms-page-listing span.page-list-prev img,
div.mybms-page-listing span.page-list-next img {
	width: 15px;
	
	position: relative;
	top: 3px;
	
	transition: transform 0.2s ease-in-out;
}
div.mybms-page-listing span.page-list-first img,
div.mybms-page-listing span.page-list-last img {
	width: 16px;
	
	position: relative;
	top: 3px;
	
	transition: transform 0.2s ease-in-out;
}
div.mybms-page-listing span.page-list-first:not(.page-list-deactive):hover img,
div.mybms-page-listing span.page-list-prev:not(.page-list-deactive):hover img,
div.mybms-page-listing span.page-list-next:not(.page-list-deactive):hover img,
div.mybms-page-listing span.page-list-last:not(.page-list-deactive):hover img {
	opacity: 0.4;
	transform: scale(1.5);
}

/** Deactive class */
div.mybms-page-listing p.page-list-deactive,
div.mybms-page-listing span.page-list-deactive {
	cursor: default;
	opacity: 0.5;
}


/* Records table
-------------------------------------------------------------- */
@media screen and (min-width: 0px) {
	div.mybms-records .mybms-records-hide {
		display: none;
	}
	div.mybms-records th {
		font-size: 11px;
	}
}

@media screen and (min-width: 1100px) {
	div.mybms-records th.mybms-records-hide,
	div.mybms-records td.mybms-records-hide {
		display: table-cell;
	}

	div.mybms-records tr.mybms-records-hide {
		display: table-row;
	}

	div.mybms-records col.mybms-records-hide {
		display: table-column;
	}
	div.mybms-records th {
		font-size: 13px;
	}
}
div.mybms-records {
	cursor: default;
	
	width: calc(100%);
	padding: 0px;
}
div.mybms-records-shadow {
	position: relative;
	isolation: isolate;

	width: 100%;

	overflow: hidden;
	border-radius: var(--border-radius);
}
div.mybms-records-shadow::before {
	content: "";

	position: absolute;
	z-index: 3;
	inset: 0;

	pointer-events: none;

	box-shadow:
		inset 0 8px 8px rgb(0 0 0 / 0.20),
		inset 0 -8px 8px rgb(0 0 0 / 0.12);
}
div.mybms-records-scroll {
	width: auto;
	overflow-y: auto;

	background: var(--color-table-background);
}
div.mybms-records table {
	cursor: default;

	position: relative;

	width: 99.8%;
	border-collapse: seperate;
	table-layout: fixed;
	
	font-size: 12px;
}

/** Records height & colors */
/** Header */
div.mybms-records th span.mybms-records-title-inline {
	display: inline-block;
	padding: 5px 6px 5px 6px;
	
	position: relative;
	top: 2px;
	
	font-weight: var(--font-weight-bold);
	font-family: 'VagRounded';
	color: rgb(var(--color-mybms));
	
	transition:
		transform 0.2s ease-in-out,
		color 0.2s ease-in-out;
}
div.mybms-records thead th {
	position: sticky;
	top: 0;
	z-index: 2;
}
div.mybms-records th {

	background: rgb(var(--color-table-header-background) / 0.4);
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;	
	user-select: none;
	
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	
	transition:
		background 0.2s ease-in-out;
}
div.mybms-records th.mybms-records-title-clickable {
	cursor: pointer;
}
div.mybms-records th.mybms-records-scroll-effect {
	background: rgb(var(--color-table-header-background-active) / 0.8);
}
div.mybms-records th.mybms-records-title-clickable:hover {
	background: var(--color-table-header-background-hover);
}
div.mybms-records th.mybms-records-title-clickable:hover span.mybms-records-title-inline {
	transform: scale(1.04);
	color: rgb(var(--color-accent) / 0.9);
}
div.mybms-records th.mybms-records-sort-asc::before,
div.mybms-records th.mybms-records-sort-desc::before {
	content: "";
	
	display: inline-block;
	vertical-align: middle;

	width: 10px;
	height: 10px;
	
	position: relative;
	left: 5px;
	
	margin-right: 5px;

	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	
	transition:
		background-image 0.2s ease-in-out,
		transform 0.2s ease-in-out;
}
div.mybms-records th.mybms-records-sort-asc::before {
	background-image: var(--arrow-up-mybms);
}
div.mybms-records th.mybms-records-sort-asc:hover::before {
	background-image: var(--arrow-up);
	transform: scale(1.08);
}
div.mybms-records th.mybms-records-sort-desc::before {
	background-image: var(--arrow-down-mybms);
}
div.mybms-records th.mybms-records-sort-desc:hover::before {
	background-image: var(--arrow-down);
	transform: scale(1.08);
}

div.mybms-records th,
div.mybms-records td {
	min-width: 0;
	text-wrap: nowrap;
}
div.mybms-records th {
	height: var(--mybms-table-header-row-height);
}
div.mybms-records tr {
	transition: background-color 0.1s ease-in-out;
}
div.mybms-records th.mybms-records-selectall .check-box {
	position: relative;
	top: 3px;
	left: 7px;
}
div.mybms-records th.mybms-records-selectall:hover {	
	background-color: var(--color-table-td-hover-checkbox);
}

/** List */
div.mybms-records td {
	color: rgb(var(--color-accent));
	min-width: 0;
}
div.mybms-records td span.mybms-records-item-inline {
	display: block;

	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	
	padding-left: 6px;
	padding-right: 6px;

	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
div.mybms-records tr.mybms-records-tr-item {
	cursor: pointer
}
div.mybms-records td:not(.mybms-records-checkbox):hover {	
	background-color: var(--color-table-td-hover);
	color: rgb(var(--color-secondary));
}
div.mybms-records td.mybms-records-checkbox:hover {	
	background-color: var(--color-table-td-hover-checkbox);
}
div.mybms-records tr.mybms-records-tr-item:hover td {
	font-weight: var(--font-weight-bold);
	color: rgb(var(--color-secondary));
}
div.mybms-records tr.mybms-records-tr-item:hover td span.mybms-records-item-inline {
}

/** Checkbox */
td.mybms-records-checkbox {
	padding: 0px;
}
td.mybms-records-checkbox .check-box {
	position: relative;
	
	top: 3px;
	left: 7px;
}

/** Borders */
div.mybms-records th {
	
	border-top: 1px solid rgb(var(--color-border-table));
	border-right: 1px solid rgb(var(--color-border-table));
	border-bottom: 1px solid rgb(var(--color-border-table));
	border-left: 0;
}
div.mybms-records th:first-child {
	border-left: 1px solid rgb(var(--color-border-table));
}
div.mybms-records td {
	border-right: 1px solid rgb(var(--color-border-table));
	border-bottom: 1px solid rgb(var(--color-border-table));
	border-left: 0;
}
div.mybms-records td:first-child {
	border-left: 1px solid rgb(var(--color-border-table));
}
div.mybms-records thead tr:first-child th:first-child {
	border-top-left-radius: 5px;
}
div.mybms-records thead tr:first-child th:last-child {
	border-top-right-radius: 5px;
}
div.mybms-records tbody tr:last-child td:first-child {
	border-bottom-left-radius: 5px;
}
div.mybms-records tbody tr:last-child td:last-child {
	border-bottom-right-radius: 5px;
}

/** Footer */
div.mybms-records-footer,
div.mybms-records-footer-start,
div.mybms-records-footer-end {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
div.mybms-records-footer {
	height: 35px;
}
div.mybms-records-footer-start,
div.mybms-records-footer-end {
	position: relative;
	top: 4px;
}
div.mybms-records-footer div.mybms-records-footer-results {
	border-radius: var(--border-radius);
	background: var(--color-alpha-background-darkest);
	
	padding: 7px 6px;
	
	font-family: 'VagRounded'; 
	color: rgb(var(--color-mybms));	
}
div.mybms-records-footer div.mybms-page-listing {
	padding: 4px 4px;
	margin-right: 10px;
	
	border-radius: var(--border-radius);
	background: var(--color-alpha-background-darkest);
}

/** Footer Buttons */
div.mybms-records-footer .button-icon {
	width: 25px;
	height: 25px;
}

	
/** Row-height helper classes */
.mybms-records-row-height-15 { height: 15px; }
.mybms-records-row-height-16 { height: 16px; }
.mybms-records-row-height-17 { height: 17px; }
.mybms-records-row-height-18 { height: 18px; }
.mybms-records-row-height-19 { height: 19px; }
.mybms-records-row-height-20 { height: 20px; }
.mybms-records-row-height-21 { height: 21px; }
.mybms-records-row-height-22 { height: 22px; }
.mybms-records-row-height-23 { height: 23px; }
.mybms-records-row-height-24 { height: 24px; }
.mybms-records-row-height-25 { height: 25px; }
.mybms-records-row-height-26 { height: 26px; }
.mybms-records-row-height-27 { height: 27px; }
.mybms-records-row-height-28 { height: 28px; }
.mybms-records-row-height-29 { height: 29px; }
.mybms-records-row-height-30 { height: 30px; }
.mybms-records-row-height-31 { height: 31px; }
.mybms-records-row-height-32 { height: 32px; }
.mybms-records-row-height-33 { height: 33px; }
.mybms-records-row-height-34 { height: 34px; }
.mybms-records-row-height-35 { height: 35px; }
.mybms-records-row-height-36 { height: 36px; }
.mybms-records-row-height-37 { height: 37px; }
.mybms-records-row-height-38 { height: 38px; }
.mybms-records-row-height-39 { height: 39px; }
.mybms-records-row-height-40 { height: 40px; }
.mybms-records-row-height-41 { height: 41px; }
.mybms-records-row-height-42 { height: 42px; }
.mybms-records-row-height-43 { height: 43px; }
.mybms-records-row-height-44 { height: 44px; }
.mybms-records-row-height-45 { height: 45px; }
.mybms-records-row-height-46 { height: 46px; }
.mybms-records-row-height-47 { height: 47px; }
.mybms-records-row-height-48 { height: 48px; }
.mybms-records-row-height-49 { height: 49px; }
.mybms-records-row-height-50 { height: 50px; }
	
	

/** Starting width helper classes */
@media screen and (min-width: 0px) {
	col.mybms-col-checkbox { width: 32px; }
	col.mybms-col-5 { width: 60px; }
	col.mybms-col-10 { width: 150px; }
	col.mybms-col-15 { width: 150px; }
	col.mybms-col-20 { width: 200px; }
	col.mybms-col-25 { width: 250px; }
	col.mybms-col-30 { width: 250px; }
	col.mybms-col-35 { width: 250px; }
	col.mybms-col-40 { width: 250px; }
	col.mybms-col-45 { width: 250px; }
	col.mybms-col-50 { width: 250px; }
	col.mybms-col-55 { width: 250px; }
	col.mybms-col-60 { width: 250px; }
	col.mybms-col-65 { width: 250px; }
	col.mybms-col-70 { width: 250px; }
	col.mybms-col-75 { width: 250px; }
	col.mybms-col-80 { width: 250px; }
	col.mybms-col-85 { width: 250px; }
	col.mybms-col-90 { width: 250px; }
	col.mybms-col-95 { width: 250px; }
	col.mybms-col-100 { width: 100%; }
}

@media screen and (min-width: 1100px) {
	col.mybms-col-checkbox { width: 32px; }
	col.mybms-col-5 { width: 5%; }
	col.mybms-col-10 { width: 10%; }
	col.mybms-col-15 { width: 15%; }
	col.mybms-col-20 { width: 20%; }
	col.mybms-col-25 { width: 25%; }
	col.mybms-col-30 { width: 30%; }
	col.mybms-col-35 { width: 35%; }
	col.mybms-col-40 { width: 40%; }
	col.mybms-col-45 { width: 45%; }
	col.mybms-col-50 { width: 50%; }
	col.mybms-col-55 { width: 55%; }
	col.mybms-col-60 { width: 60%; }
	col.mybms-col-65 { width: 65%; }
	col.mybms-col-70 { width: 70%; }
	col.mybms-col-75 { width: 75%; }
	col.mybms-col-80 { width: 80%; }
	col.mybms-col-85 { width: 85%; }
	col.mybms-col-90 { width: 90%; }
	col.mybms-col-95 { width: 95%; }
	col.mybms-col-100 { width: 100%; }
}



/* Statistics
-------------------------------------------------------------- */
@media screen and (min-width: 0px) {
	:root {
		--mybms-chart-max-width: 100%;
	}
}
div.mybms-statistics {
	position: relative;
	
	margin: 0;
	
	width: calc(100% - 10px);
	height: 100%;
	
	font-family: 'VAGRounded';
	font-size: 14px;
	
	color: rgb(var(--color-mybms));
}

/** Navigation */
div.mybms-statistics div.mybms-statistics-navigation {
	display: flex;
	justify-content: end;
	align-items: center;
	
	gap: 10px;
}
div.mybms-statistics div.mybms-statistics-navigation select {
	width: auto;
}

/** Chart drawing */
.mybms-statistics-chart {
	width: inherit;
	max-width: var(--mybms-chart-max-width);
}

.mybms-statistics-chart svg {
	width: inherit;
	height: auto;
	display: block;

	color: rgb(var(--color-mybms));
}

.mybms-statistics-axis {
	stroke: rgb(var(--color-secondary));
	stroke-width: 2;
}

.mybms-statistics-grid {
	stroke: rgb(var(--color-mybms));
	stroke-width: 1;
	opacity: .2;
}

.mybms-statistics-axis-label {
	fill: rgb(var(--color-secondary) / 0.8);
	font-family: 'VAGRounded';
	font-size: 11px;
}
