@import 'style_layout.css';
@import 'style_elements.css';




/* Serial Data view, Serial Console etc */
.console {
	background-color: #e9ecef;
	font-family: monospace;
	margin: 0;
	padding-left: 0.5rem; 
	padding-right: 0.5rem; 
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	font-size: 0.9rem;
}
.console.vscroll {
	overflow-y: scroll;
}

/* Serial Data view, Serial Console etc */
.debug_console {
	background-color: #e9ecef;
	font-family: monospace;
	margin: 0;
	padding-left: 0.1rem; 
	padding-right: 0.1rem; 
	margin-top: 0.1rem;
	margin-bottom: 0.1rem;
	font-size: 0.7rem;
}
.debug_console.vscroll {
	overflow-y: scroll;
}


/*
section {
	height: 100%;
	display: flex;
	flex-direction : column;
}
*/

header {
	/*background: lightblue;*/
	padding: 0.25rem;
}


.tabbody {
	flex: 1; /* or flex-grow: 1 */;
	overflow-x: auto;
	/*background: gold;*/
}

.tabbody.pad {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

footer {
	/*background: lightgreen;*/
	/*min-height: 60px;*/
}

content {
	/*background: lightgreen;*/
	/*min-height: 60px;*/
}

.hor_line {
	margin-top: 1rem;
	margin-bottom: 1rem;
	size: 3; 
	width:100%; 
	color:black;
}



.float_center {
	margin: auto;
	/*width: 50rem;*/
	max-width: 100rem;
	min-width: 40%;
	/*border: 3px solid green;*/
	padding: 10px;
}

.float_center_hor {
	margin-left: auto;
	margin-right: auto;
	margin-top: 1rem;
	/*width: 50rem;*/
	max-width: 50rem;
	min-width: 40%;
	/*border: 3px solid green;*/
	padding: 10px;
}

.box_element {
	margin: 1rem; padding: 1rem
}


/* 
make tab width smaller 
https://stackoverflow.com/a/7780923/1683382
*/
textarea,
pre {
	-moz-tab-size : 4;
	-o-tab-size : 4;
		tab-size : 4;
}

/* moved content of for example div into vertical center (use w-100 to expand the div before) */
.align_center {
	text-align: center;
}

/* Puts all content in div to center (hor and vertical) */
.center_content {
	display: flex;
	align-items: center;
	justify-content: center;
}


/************* SCROLLBAR ******************/

/* https://css-tricks.com/the-current-state-of-styling-scrollbars-in-css/ */

::-webkit-scrollbar {
	width: 10px; /* Mostly for vertical scrollbars */
	height: 10px; /* Mostly for horizontal scrollbars */
}

::-webkit-scrollbar-track { /* Background */
	/*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); */
	background: #EEE;
	/*border-radius: 10px;*/
}

::-webkit-scrollbar-thumb { /* Foreground */
	border-radius: 10px;
	background: #999;
	/*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); */
}

/************* FOR DEBUG ******************/

.debug {
	/* border: 1px dotted red; */
}

/*
div {
	border: 1px dotted red; 
}
*/



/************* test *************/

.bg-dark-blue {
	background-color: var(--color-primary-dark)! important;
}



/************ utils ***************/

.round_corners {
	border-radius: 10px;
}