@media print
{    
    .noprint    {
        display: none;
    }
}

body {
	margin: 0;
	padding: 0;
	font-size:10pt; 
    font-family : verdana, arial, helvetica,sans-serif;
    font-weight : normal;
    color : var(--mainColour-text);
    line-height : 15pt;
}

P  {
    list-style-type : square;
    list-style-position : outside;
    list-style : outside;
}

#maincontainer {
	width: 92vw;
	height: 90vh;
	margin: 0 2.5vw 0 2.5vw;
}
@media (max-width:600px)	{
	#maincontainer {
		width: 94vw;
		height: 90vh;
		margin: 0 0.5vw 0 0.5vw;
	}
	
}

img, input, textarea, select{
	max-width: 100%;
}
button	{
	border: outset medium lightgrey;
}
button:active	{
	border: inset medium lightgrey;
}
#floatMenu	{
	border: none;
	position: sticky;
	left: 0;
	bottom: 0;
}

#toggle-wrapper {
	/*position: relative;*/
	/*overflow: hidden;*/
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
}

.toggle-menu	{
	border: none;
	width: 5px;
	height: 100%;
	float: left;
	background-color: var(--navColour-bg);
	color: var(--navColour-text);
	padding: 5px 0px 5px 5px;
	transition: width 0.2s;
	overflow: hidden;
}
.toggle-menu:hover	{
    width: 280px;
}
.toggle-menu-ForceOn	{
	border: none;
    width: 280px;
	height: 100%;
	float: left;
	background-color: var(--navColour-bg);
	color: var(--navColour-text);
	padding: 5px 0px 5px 5px;
	transition: width 0.2s;
}

#mobile-content{
	height: 100%; 
	overflow: scroll; 
	width: 100%;
}

.header {
	margin: 2vh 0 0 0; 
	height:8vh; 
	vertical-align: middle; 
	width: 48.5%; 
}

/* Version/changelog link in header – matches portal nav link style */
.header .version-link {
	color: var(--navColour-link);
	text-decoration: none;
	font-weight: normal;
}
.header .version-link:hover {
	text-decoration: underline;
	background-color: var(--navColour-hover);
}
.header .version-link:visited {
	color: var(--navColour-link);
}

.navgrp	{
	font-size: 1.6em;
	font-weight: bold;
	padding-top: 0.8em;
}
.loginNote	{
	font-size: 1.0em;
	padding-left: 0.1em;
	line-height: 1.5em;
	font-weight: bolder;
	color: var(--navColour-longinNote);
}
.navlist	{
	font-size: 1.0em;
	padding-left: 0.1em;
	line-height: 1.5em;
	list-style-type: none;
	color: var(--navColour-link);
}
.navlist .li	{
	font-weight: bolder;
	text-decoration: none;
}
.navlist .li2	{
	font-weight: normal;
	padding-left: 1em;
	text-decoration: none;
}
.navlist .li:hover, .navlist .li2:hover {
	cursor: pointer;
	background-color: var(--navColour-hover);
}
.navlist a:visited	{
	color: var(--navColour-link);
}

.navTooltip{
	border: solid thin black;
	display: none;
	width: 0;
	height: 0;
	transition: width 0.2s;
	overflow: hidden;
	float: left;
}
.navTooltipShow{
	position: absolute;
	display: initial;
	color: var(--mainColour-text);
	background-color: var(--mainColour-bg);
	border: solid thin black;
	width: 20em;
	height: auto;
	padding: 2px;
	transition: width 0.3s, height 0.3s;
	overflow: hidden;
	float: left;
}

#activeJob,	#activeTZ {
	border: none;
	color: var(--navColour-longinNote);
	background-color: var(--navColour-bg);
	font-weight: bold;
	text-align: right;
}

#activeJob:hover, #activeTZ:hover	{
	border: solid thin black;
	background-color: white;
}

/* more and less arrows */
.more-arrow {
  width: 0.8em; 
  height: 0em; 
  border-top: 0.5em solid transparent;
  border-bottom: 0.5em solid transparent;
  border-left: 0.8em solid grey;
  float: left;
  display:inline;
  cursor: pointer;
}

.less-arrow {
  width: 0em; 
  height: 0em; 
  border-left: 0.5em solid transparent;
  border-right: 0.5em solid transparent;
  border-bottom: 0.8em solid grey;
  float: left;
  display:none;
  cursor: pointer;
}

/* Little status dot next to SafetyPortal in the left nav */
/* Base dot for SafetyPortal in the left nav */
.nav-status-dot {
  display: inline-block;
  width: 0.6em;
  height: 0.6em;
  border-radius: 999px;
  margin-right: 0.35em;
  background-color: #9ca3af; /* default grey */
}

/* All good */
.nav-status-ok {
  background-color: #16a34a; /* green */
}

/* Something expiring soon (≈30 days) */
.nav-status-warn {
  background-color: #facc15; /* amber */
}

/* Missing or expired training */
.nav-status-issue {
  background-color: #f97316; /* deeper orange/amber */
}

/* No requirements configured */
.nav-status-none {
  background-color: #38bdf8; /* blue */
}

/* Unknown/error/failed fetch */
.nav-status-unknown {
  background-color: #9ca3af; /* grey */
}