.dp-form { margin-bottom: 18px; }
.dp-form .form-group { margin-bottom: 12px; }
.dp-form label { display: block; font-size: 13px; font-weight: bold; margin-bottom: 4px; color: #2c3e50; }
.dp-form input.form-control { max-width: 520px; }
.dp-types { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.dp-types label.dp-type { display: inline-block; font-weight: normal; margin: 0; font-family: monospace; cursor: pointer; }
.dp-types label.dp-type input { margin-right: 3px; }
.dp-status { margin-left: 10px; font-size: 13px; color: #777; }

.dp-error { padding: 10px 12px; margin-bottom: 14px; border: 1px solid #ebccd1; background: #f2dede; color: #a94442; font-size: 13px; border-radius: 3px; }
.dp-summary { padding: 10px 12px; margin-bottom: 14px; border: 1px solid #ddd; background: #f5f5f5; font-size: 14px; font-weight: bold; border-radius: 3px; }
.dp-summary.dp-s-ok { background: #dff0d8; border-color: #d6e9c6; color: #3c763d; }
.dp-summary.dp-s-diff { background: #fcf8e3; border-color: #faebcc; color: #8a6d3b; }
.dp-summary.dp-s-unknown { background: #f2dede; border-color: #ebccd1; color: #a94442; }

.dp-group-title { font-size: 14px; font-weight: bold; margin: 18px 0 8px; border-left: 4px solid #337ab7; padding-left: 8px; }
.dp-group-note { font-size: 13px; font-weight: normal; margin-left: 8px; }
.dp-group-note.dp-ok { color: #3c763d; }
.dp-group-note.dp-diff { color: #8a6d3b; }

.dp-table { width: 100%; border-collapse: collapse; margin-bottom: 12px; font-size: 13px; }
.dp-table td { padding: 7px 10px; border: 1px solid #ddd; vertical-align: top; word-break: break-all; }
.dp-name { white-space: nowrap; width: 200px; color: #2c3e50; background: #fafafa; }
.dp-ip { display: block; font-family: monospace; font-size: 11px; color: #888; }
.dp-value { font-family: monospace; }
.dp-value div { margin-bottom: 2px; }
.dp-ttl { white-space: nowrap; width: 90px; text-align: right; color: #777; font-size: 12px; }
.dp-minor { background: #fcf8e3; }
.dp-none { color: #777; font-family: inherit; }
.dp-err { color: #a94442; font-family: inherit; }

@media (max-width: 600px) {
	.dp-name { width: auto; white-space: normal; }
	.dp-ttl { width: auto; }
	.dp-form input.form-control { max-width: 100%; }
}