/**
 * Dashboard Principals Styles
**/

.Dashboard {
	color: var(--text-color-high, #212529) !important;
}

.Dashboard h3 {
	color: var(--text-color-high, #000);
}

.Dashboard hr {
	border: 0;
	height: 0;
	overflow: visible;
	margin: 0;
	box-sizing: content-box;
	border-top: 1px solid var(--border-color-medium, rgba(0, 0, 0, 0.1));
}

.Dashboard .box-s1 {
	min-height: 466px;
}

.Dashboard .internet-status-self .internet-status-info .title {
	height: 97px;
}

.Dashboard .dashboard-bg {
	border-radius: 16px;
	background-color: var(--background-color-medium, #e0e0e0);
}

.Dashboard .title {
	text-align: center;
}

.Dashboard .section-content {
	display: flex;
	vertical-align: top;
	padding: 20px 0 0 0;
	align-items: flex-start;
	justify-content: space-between;
}

.Dashboard .section-content > div {
	width:100%;
	padding:1.5em;
}

.Dashboard .section-content  .settings-info {
	padding-top:1em;
}

.Dashboard .section-content .internet-status-info .settings-info {
	display: flex;
	justify-content: space-around;
}

.Dashboard .section-content .internet-status-info .settings-info > div > p > i{
	padding: 0 0 0 5px;
}

.Dashboard .section-content > div:nth-child(2) {
	margin-left:20px;
}

.Dashboard .devices-list .devices-info {
	margin-bottom: 0;
}

.Dashboard .devices-list .devices-info .tr .td{
	padding:0px 0 0 10px;
}

.Dashboard .devices-list .devices-info .tr .td:first-child {
	width: 33%;
	word-break: break-all;
}

.Dashboard .devices-list hr:nth-child(4) {
	margin-top: 0;
	margin-bottom: 8px;
}

.Dashboard .router-status-lan .devices-list .table-titles .th:first-child {
	width: 35%;
}

.Dashboard .router-status-self .router-status-info .settings-info {
	padding-left:27px;
}

.Dashboard .router-status-self .router-status-info .title h3 {
	margin-top:-2px;
}

.Dashboard .router-status-info svg {
	width: 70px;
}

.Dashboard .internet-status-self .settings-info p:first-child span:first-child{
	font-size: 15px;
	font-weight: 500;
}

.Dashboard .internet-status-self .settings-info p:nth-child(2) span:first-child,
.Dashboard .router-status-wifi .wifi-info .settings-info p:first-child span:first-child,
.Dashboard .router-status-wifi .wifi-info .settings-info p:nth-child(2) span:first-child{
	font-weight: 700;
}

.Dashboard .settings-info p span:first-child {
	width: 35%;
	font-size: 12px;
	text-align: right;
}

.Dashboard .settings-info p span:nth-child(2){
	display: inline-block;
	word-break: break-all;
}

.Dashboard .settings-info p span:nth-child(2).label {
	padding: 1px 4px 1px 4px;
	font-size: 9.75px;
}

.Dashboard .router-status-info .settings-info p span:nth-child(2){
	max-width: 283px;
}

.Dashboard .settings-info p span.ssid {
	max-height: 18px;
	top: 3px;
}

.Dashboard .settings-info p span.encryption {
	max-width: 82px;
}

.Dashboard .router-status-wifi .wifi-info .settings-info,
.Dashboard .router-status-lan .lan-info .settings-info
{
	display: flex;
	justify-content: space-around;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .tr .td {
	padding: 0 10px 0 10px;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .tr .td:first-child {
	width: 30%;
	word-break: break-all;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .tr .td:nth-child(2) {
	width: 21%;
	overflow: hidden;
	padding-left:0;
	word-break: break-all;
}

.Dashboard .router-status-wifi .wifi-info .settings-info{
	padding:1em 0 1em 0;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .tr .td:nth-child(3) {
	width: 22%;
	overflow: hidden;
	position: relative;
	top: -3px;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .tr .td:nth-child(5) {
	width: initial;
}

.Dashboard .router-status-wifi .wifi-info > hr:last-child {
	margin-bottom:0;
}

.Dashboard .router-status-wifi .wifi-info .devices-info .device-info .progress {
	padding: 0;
	width: 100%;
	margin: 0;
}

.Dashboard .wifi-info .devices-info .table-titles {
	border-bottom: 1px solid var(--border-color-medium, rgba(0, 0, 0, 0.1));
}

.Dashboard .table {
	width: auto;
	text-align: left;
}

[data-darkmode="true"] {
	/* invert black SVG line drawings in dark mode */
	.Dashboard
	.svgmonotone {
		filter: invert(.5);
	}
}

/**
 * Responsive
 **/
@media screen and (min-width: 200px) and (max-width: 640px) {

	.Dashboard .cbi-section-1 > .section-content {
		padding-top:10px;
	}

	.Dashboard .section-content {
		display:block;
	}

	.Dashboard .section-content > div{
		padding: 1em;
	}

	.Dashboard .section-content > div:first-child {
		margin-bottom:10px;
	}

	.Dashboard .section-content > div:nth-child(2) {
		margin:0;
	}

	.Dashboard .router-status-self .router-status-info .settings-info {
		padding:0;
	}

	.Dashboard .section-content .internet-status-info .settings-info {
		display:block;
	}

	.Dashboard .section-content .internet-status-info .settings-info > div:first-child {
		margin-bottom: 10px;
		border-bottom: 1px solid var(--border-color-medium, rgba(0, 0, 0, 0.1));
	}

	.Dashboard .section-content .router-status-lan .devices-info .table-titles {
		display:block;
	}

	.Dashboard .router-status-wifi .wifi-info .settings-info > div{
		flex:1;
	}

	.Dashboard .section-content .router-status-lan .devices-info .table-titles .th:last-child{
		padding-left: 70px;
	}

	.Dashboard .section-content .router-status-lan .devices-info .td:first-child{
		flex: 2 2 31%;
	}

	.Dashboard .section-content .router-status-lan .devices-info .td:nth-child(2){
		flex: 1 1 24%;
		padding: 0;
	}

	.Dashboard .section-content .router-status-lan .devices-info .td:last-child{
		word-wrap: normal;
	}

	.Dashboard .router-status-wifi .wifi-info .settings-info > div p:nth-child(6) > span:last-child{
		display: inline-block;
		overflow: hidden;
		height: 14px;
		width: 52%;
		word-break: break-word;
		line-height: 15px;
	}

	.Dashboard .wifi-info .devices-info .table-titles {
		padding: 0;
		margin: 0;
		display: flex;
		border-radius: initial;
	}

	.Dashboard .wifi-info .devices-info .table-titles .th {
		flex: 2 2 24%;
	}

	.Dashboard .wifi-info .devices-info .tr .td {
		flex: 2 2 10%;
	}

	.Dashboard .wifi-info hr:nth-child(4) {
		margin-bottom: 0;
	}
}