:not(:defined) {
  visibility: hidden;
}

:root {
  /* Definere */
  --primary-color: #374151;
  --primary-text-color: #3b3b3b;
  --table-text-color: #3b3b3b;
  --secondary-text-color: #929292;
  --primary-background-color: rgb(248, 248, 248);
  --contrast-background-color: var(--wa-color-neutral-90);
  --contrast-text-color: var(--wa-color-neutral-20);
  --card-background-color:  white;
  --quiet-background-color: #eee;
  --selected-background-color: var(--wa-color-yellow-90);
  --selected-text-color: #000;
  --menu-hover-background: var(--wa-color-blue-60);
  --menu-hover-text: white;
  --track-bar-color: #ccc;
  --dim-color: var(--wa-color-neutral-80);
  --dimmer-color: var(--wa-color-neutral-90);
  --chart-height-big: 550px;
  --page-max-width: 85rem;
  --text-opacity: .7;
}
:root.wa-dark {
	--primary-text-color: #ccc;
	--secondary-text-color: #929292;
	--table-text-color: #939393;
	--primary-background-color:  var(--wa-color-neutral-0);
	--contrast-background-color: var(--wa-color-neutral-10);
	--contrast-text-color: var(--wa-color-neutral-60);
	--card-background-color:  var(--wa-color-neutral-10);
	--quiet-background-color: #333;
	--selected-background-color: var(--wa-color-yellow-30);
	--selected-text-color: #ccc;
	--track-bar-color: #444;
	--dim-color: var(--wa-color-neutral-30);
	--dimmer-color: var(--wa-color-neutral-20);
}
body {
	background-color: var(--primary-background-color);
	padding: 1rem 2rem;
	font-family: "Lato", sans-serif;
}
footer {
	max-width: var(--page-max-width);
	margin-inline: auto;
	color: var(--primary-text-color);
	text-align: center;
	margin-block: 4rem;
	font-size: var(--wa-font-size-xs);
	padding-top: 1rem;
	border-top: var(--wa-border-width-s) dashed var(--wa-color-border-quiet);
	div {
		opacity: .6;
	}
}
.mobile-menu {
	display: none;
}
@media (max-width: 600px) {
  /* gjelder hele viewport */
  :root {
  --chart-height-big: 300px;
  }
  body {
	  padding: revert;
	  padding: .5rem;
  }
  .main-menu,.switch-mode {
	  display: none;
  }
  .mobile-menu {
	  display: revert;
	  /*
	  position: sticky;
	  top: .5rem;
	  z-index: 199;
	  */
  }
}
.mono {
	font-family: "Sometype Mono", monospace;
	font-optical-sizing: auto;
}
.main-menu {
	max-width: var(--page-max-width);
	margin-inline: auto;
	position: relative;
}
.new-content {
	max-width: var(--page-max-width);
	margin-inline: auto;
}
.content {
	max-width: var(--page-max-width);
	margin-inline: auto;
	margin-top: 1rem; 
	container-type: inline-size;
	container-name: layout;
	.left-widgets {
		width: 22rem;
	  }
}
@container layout (max-width: 400px) {
  .left-widgets {
	min-width: revert;
  }
}
.switch-mode {
	position: absolute;
	z-index: 109;
	top: .5rem;
	right: 1rem;
	font-size: var(--wa-font-size-xs);
	a {
		text-decoration: none;
	}
	a:hover {
		text-decoration: underline;
	}
	.config-mode {
		opacity: .6;
		position: absolute;
		right: 0;
		top:0;
	}
	.config-mode:hover {
		cursor: pointer;
		opacity: 1;
	}
	.option-set {
		position: absolute;
		z-index: 120;
		right:-10px;
		top:-10px;
		padding: .5rem 1.5rem .8rem 1rem;
		background-color: var(--card-background-color);
		border: var(--wa-border-width-s) var(--wa-border-style) var(--wa-color-border-quiet);
		font-size: var(--wa-font-size-m);
		box-shadow: var(--wa-shadow-l);
		border-radius: .6rem;
		
	}
}
strava-menu {
	position: sticky;
	top: .5rem;
	left: 0;
	right: 0;
	/*
	margin-inline: auto;
	width: fit-content;
	*/
}
nav {
	display: flex;
	justify-content: center;
	position: sticky;
	top: 1rem;
	z-index: 99;
	border-radius: .6rem;
	overflow: hidden;
	background-color: var(--card-background-color);
	width: fit-content;
	min-width: 200px;
	color: var(--primary-text-color);
	/*border: var(--wa-border-width-s) var(--wa-border-style) var(--wa-color-border-quiet);*/
	margin-inline: auto;
	box-shadow: var(--wa-shadow-m);
}
nav > * {
	border-left: var(--wa-border-width-s) var(--wa-border-style) var(--wa-color-border-quiet);
	border-right: var(--wa-border-width-s) var(--wa-border-style) var(--wa-color-border-quiet);
	padding:.3rem 1rem;
	font-size:  var(--wa-font-size-xs);
	font-weight: 600;
}
nav > *:hover {
	background-color: var(--menu-hover-background);
	color: var(--menu-hover-text);
	cursor: pointer;
}
nav > *:is(:last-child){
	border-right-width: 0;
}
nav > *:is(:first-child){
	border-left-width: 0;
}
.is-hidden {
	display: none !important;
}
.main {
	padding: 2rem;
	
}
.switch-mode .is-disabled {
  pointer-events: none; /* ekstra sikring */
  color: var(--secondary-text-color);
  opacity: 0.6;
  cursor: default;
}
.tabulator-footer-contents {
	button {
		color: #666;	
	}
	
}