/*@layer primeng,base,app;*/
@layer uvnetworks, misc, bootstrap, primeng;

html, body {
	height: 100%;
	font-size: 14px;
	margin: 0px;
	padding: 0px;
}

input, select, textarea {
	font-size: 14px !important;
	padding: 3.75px !important;
	border-radius: 3px !important;
}

	input:disabled, select:disabled, textarea:disabled {
		background-color: white !important;
		color: rgb(51, 51, 51) !important;
		opacity: 0.5 !important;
	}

app {
	height: 100%;
}

.btn {
	border-radius: 3px;
}

.loading-logo {
	height: 100px;
	margin-right: 10px;
}

.loading-text {
	font-size: 16pt;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.ckbox-label {
	padding-left: 20px;
	font-weight: bold;
}

.show-error {
	border-color: #a94442;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.uv-save-button {
	position: absolute;
	top: 10px;
	right: 10px;
}

.uv-dump-agent-config-button {
	position: absolute;
	top: 10px;
	right: 200px;
}

:root {
	--table-button-width: 37px;
	--table-button-margin-right: 5px;
	--table-button-fudge: 10px;
}

.uv-table-button-column-1 {
	flex-basis: calc((var(--table-button-width) + var(--table-button-margin-right)) * 1 + var(--table-button-fudge)) !important;
	flex-grow: 0 !important;
}

.uv-table-button-column-2 {
	flex-basis: calc((var(--table-button-width) + var(--table-button-margin-right)) * 2 + var(--table-button-fudge)) !important;
	flex-grow: 0 !important;
}

.uv-table-button-column-3 {
	flex-basis: calc((var(--table-button-width) + var(--table-button-margin-right)) * 3 + var(--table-button-fudge)) !important;
	flex-grow: 0 !important;
}

.uv-table-button-column-4 {
	flex-basis: calc((var(--table-button-width) + var(--table-button-margin-right)) * 4 + var(--table-button-fudge)) !important;
	flex-grow: 0 !important;
}

.uv-table-button-column-5 {
	flex-basis: calc((var(--table-button-width) + var(--table-button-margin-right)) * 5 + var(--table-button-fudge)) !important;
	flex-grow: 0 !important;
}

.uv-table-button {
	margin-right: 5px !important;
}

.uv-first-table-button {
	margin-left: 3px !important;
	margin-right: 5px !important;
}

.uv-checkbox-label {
	margin-left: 10px;
}

.uv-labeled-input {
	margin-left: 10px;
}

button:disabled {
	cursor: not-allowed;
}

.loading-screen {
	background-color: #222;
	height: 100%;
	margin:0;
	padding:0;
}

	.loading-screen .content {
		margin: 0 auto;
		color: #4189C7;
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	}

.infoset-column-selector .p-listbox {
	width: 100%;
}

.infoset-column-selector .p-dialog .p-dialog-titlebar {
	margin: 0px 0px 0px 0px;
}

p-dialog .input-block {
	display: block;
}

.nav-tabs .nav-item {
	border: 1px solid #c8c8c8;
	margin: right 2px;
}

.nav-item a {
	color: var(--primary-text-color, #555555);
}

	.nav-item a:hover {
		color: var(--primary-text-color, #555555);
	}

.data-tab {
	background: #F2DADA;
	color: var(--primary-text-color, #555555);
}

.nav-tabs .data-tab .nav-link.active {
	background: #7F3F3F;
	color: white;
}

.config-tab {
	background: #BBDDDD;
	color: var(--primary-text-color, #555555);
}

.nav-tabs .config-tab .nav-link.active {
	background: #006666;
	color: white;
}

.nav-tabs .monitor-tab .nav-link.active {
	background: #857d76;
	color: white;
}

.monitor-tab {
	background: #f2e6da;
	color: var(--primary-text-color, #555555);
}

.monitor-state-up {
	background-color: #00FF00 !important;
	color: #000000;
}

.monitor-state-down {
	background-color: #FF0000 !important;
	color: #FFFFFF;
}

.monitor-state-nodata {
	background-color: #808080 !important;
	color: #FFFFFF;
}

.monitor-state-warning {
	background-color: #FFFF00 !important;
	color: #000000;
}

.monitor-state-unknown {
	background-color: #0000FF !important;
	color: #FFFFFF;
}

.monitor-state-paused {
	background-color: #800080 !important;
	color: #FFFFFF;
}

.history-entry {
	vertical-align: top;
	padding-top: 10px !important;
}


/* p-button */

.p-button {
	margin: 2px !important;
}


/* p-menu */

.p-menu ul {
	list-style-type: none;
}


/* p-tabview */

.p-tabview .p-tabview-nav li a {
	font-weight: normal !important;
	font-size: 10pt !important;
}

.p-tabview .p-tabview-panels {
	padding: 0.0rem 0.0rem 0.0rem 0.0rem !important;
}

.p-tabview .p-tabview-panel {
	padding: .2em .4em !important;
}


/* p-table */

.p-datatable .p-datatable-wrapper {
	width: 100%;
	border: 1px solid rgb(200, 200, 200);
}

.p-datatable .p-datatable-table {
	table-layout: fixed;
	width: 100%;
}

/* For Export buttons. */
.p-datatable .p-datatable-header {
	padding-top: 0.3em !important;
	padding-bottom: 0.3em !important;
	text-align: left;
}

.p-datatable .p-datatable-thead {
	border: none;
}

.p-datatable .p-datatable-tbody {
	border: none;
}

.p-datatable .p-datatable-thead > tr:nth-child(1) > th {
	border-width: 0px 1px 0px 1px !important;
}

.p-datatable .p-datatable-thead > tr:nth-child(2) > th {
	border-width: 0px 1px 1px 1px !important;
}

.p-datatable .p-datatable-thead > tr > th {
	padding: 0.2em 0.2em 0.2em 0.2em !important;
}

	.p-datatable .p-datatable-thead > tr > th > input {
		padding: 0.0em 0.2em 0.0em 0.2em !important;
	}

	.p-datatable .p-datatable-thead > tr > th.uv-table-checkbox {
		width: 2.75em;
		min-width: 2.75em;
		max-width: 2.75em;
		padding: 0.2em 0.6em 0.2em 0.6em !important;
	}

	.p-datatable .p-datatable-thead > tr > th.uv-table-enable-checkbox {
		flex-basis: 6.25em;
		flex-grow: 0;
	}

.p-datatable .p-datatable-tbody > tr > td {
	padding: 0.2em 0.2em 0.2em 0.2em !important;
	align-content: center;
	min-width: 0px;
}

	.p-datatable .p-datatable-tbody > tr > td.uv-table-checkbox {
		width: 2.75em;
		min-width: 2.75em;
		max-width: 2.75em;
		padding: 0.2em 0.6em 0.2em 0.6em !important;
	}

	.p-datatable .p-datatable-tbody > tr > td.uv-table-enable-checkbox {
		flex-basis: 6.25em;
		flex-grow: 0;
		justify-content: center;
		text-align: center;
	}

	.p-datatable .p-datatable-tbody > tr > td > span.uv-table-value {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	/* Needed to get "..." behavior on td elements with display: table-cell
	*/
	.p-datatable .p-datatable-tbody > tr > td > div.uv-table-value {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

/* p-splitButton */

.p-splitbutton .p-splitbutton-defaultbutton {
	color: #ffffff;
	background-color: #007bff;
	border-color: #007bff;
	margin: 0px !important;
	padding-top: 5.25px;
	padding-bottom: 5.25px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	cursor: default !important;
}

	.p-splitbutton .p-splitbutton-defaultbutton:hover {
		background-color: #007bff !important;
		border-color: #007bff !important;
		margin: 0px !important;
		padding-top: 5.25px;
		padding-bottom: 5.25px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
		cursor: default !important;
	}

.p-splitbutton .p-splitbutton-menubutton {
	color: #ffffff;
	background-color: #007bff;
	border-color: #007bff;
	margin: 0px !important;
	padding-top: 5.25px;
	padding-bottom: 5.25px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

	.p-splitbutton .p-splitbutton-menubutton:hover {
		background-color: #0069d9;
		background-color: #0062cc;
	}


/* ::ng-deep doesn't seem to work on the p-table component */

.history-table .p-datatable .p-datatable-table {
	display: table;
}

.history-table .p-datatable .p-datatable-thead {
	display: table-row-group;
}

	.history-table .p-datatable .p-datatable-thead > tr {
		display: table-row;
	}

		.history-table .p-datatable .p-datatable-thead > tr > th {
			display: table-cell;
		}

.history-table .p-datatable .p-datatable-tbody {
	display: table-row-group;
}

	.history-table .p-datatable .p-datatable-tbody > tr {
		display: table-row;
	}

		.history-table .p-datatable .p-datatable-tbody > tr > td {
			display: table-cell;
		}


/*.infosets .p-tabview-panel {
	height: calc(25vh + 50px);
}*/

.event-selector {
	width: 280px;
}

.custom-snmp-entry-dialog .p-dialog-content {
	overflow: hidden;
}

.custom-snmp-settings-table .p-datatable-wrapper {
	border-bottom: 2px solid rgb(200, 200, 200);
}

.custom-snmp-history-dialog .p-dialog-content {
	overflow: hidden;
}

.prtg-history-dialog .p-dialog-content {
	overflow: hidden;
}

.port-access-vlan-dialog .p-dialog-content, .port-status-dialog .p-dialog-content, .port-poe-dialog .p-dialog-content, .switch-jack-lookup-dialog .p-dialog-content {
	overflow-y: visible;
}

.port-access-vlan-dialog .form-group, .port-status-dialog .form-group, .port-poe-dialog .form-group, .switch-jack-lookup-dialog .form-group {
	margin-left: 0px;
	margin-right: 0px;
	overflow-y: visible;
}

.uv-row {
	display: flex;
	align-items: middle;
}

select {
	appearance: auto !important;
}

.loading-split-left {
	width: 30%;
	float: left;
}

.loading-split-right {
	width: 70%;
	float: right;
}

.loading-content {
	overflow-y: hidden;
	margin-top: 20px;
	text-align: center;
	margin: 0 auto;
	text-align: left;
	width: 300px;
}

.loading-log-text {
	color: white;
	padding-left: 20px;
}

.loading-extra-padding {
	padding-top: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid white;
	margin-bottom: 10px;
}

.port-status-open {
	background-color: #00FF00 !important;
}

.port-status-closed {
	background-color: #FF0000 !important;
}