/* Monitored blacklists page (/blacklists/). Builds on pricing.css: its tokens, buttons, section heads, features, FAQ and end box. */

.bl-hero.prc-hero {
	padding-top: 136px;
	padding-bottom: 156px;
}
.bl-crumbs {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 36px;
	padding: 0 16px 0 5px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.16);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	color: #fff;
}
.bl-crumbs a,
.bl-crumbs a:focus {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
}
.bl-crumbs a:hover {
	color: #fff;
	text-decoration: none;
}
.bl-crumbs-tile {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 999px;
	background: rgba(54, 199, 119, 0.22);
	color: #9af0bf;
}
.bl-crumbs-tile .prc-i {
	width: 14px;
	height: 14px;
}
.bl-crumbs-go {
	width: 13px;
	height: 13px;
	stroke-width: 2.4;
	opacity: 0.6;
}
.bl-title {
	margin: 24px 0 0;
	max-width: 860px;
	font-family: "Open Sans", sans-serif;
	font-size: 56px;
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: #fff;
	text-wrap: balance;
}
.bl-lead {
	margin: 18px 0 0;
	max-width: 680px;
	font-size: 19px;
	line-height: 1.6;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.82);
}
.bl-search {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 640px;
	height: 60px;
	margin: 36px 0 0;
	padding: 0 10px 0 22px;
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(3, 14, 30, 0.35), 0 0 0 6px rgba(255, 255, 255, 0.1);
	text-align: left;
	transition: box-shadow 0.15s ease;
}
.bl-search:focus-within {
	box-shadow: 0 20px 50px rgba(3, 14, 30, 0.35), 0 0 0 6px rgba(54, 199, 119, 0.45);
}
.bl-search > .prc-i {
	width: 20px;
	height: 20px;
	color: var(--prc-ink);
}
.bl-search input {
	flex: 1;
	min-width: 0;
	height: 100%;
	margin: 0 0 0 14px;
	padding: 0;
	border: 0;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: inherit;
	font-size: 16.5px;
	font-weight: 400;
	color: var(--prc-ink);
	-webkit-appearance: none;
	appearance: none;
}
.bl-search input::placeholder {
	color: var(--prc-faint);
	opacity: 1;
}
.bl-search input::-webkit-search-cancel-button,
.bl-search input::-webkit-search-decoration {
	-webkit-appearance: none;
}
.bl-kbd {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 30px;
	height: 30px;
	margin: 0 6px 0 8px;
	padding: 0 8px;
	border-radius: 8px;
	border: 1px solid var(--prc-line);
	background: var(--prc-soft);
	color: var(--prc-muted);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	font-weight: 400;
	box-shadow: none;
}
.bl-search:focus-within .bl-kbd {
	visibility: hidden;
}
.bl-stats {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 28px;
	margin: 26px 0 0;
	padding: 0;
	list-style: none;
	font-size: 14.5px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.78);
}
.bl-stats li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.bl-stats strong {
	font-weight: 700;
	color: #fff;
	font-variant-numeric: tabular-nums;
}
.bl-stats .prc-i {
	width: 15px;
	height: 15px;
	color: #6ee7a0;
	stroke-width: 2.6;
}

.bl-dir {
	position: relative;
	z-index: 2;
	display: flow-root; /* keeps the card's negative margin from pulling the section, and its background, over the hero */
	padding: 0 0 88px;
	background: var(--prc-soft);
	border-bottom: 1px solid var(--prc-line-2);
}
.bl-card {
	margin-top: -96px;
	border-radius: 18px;
	background: #fff;
	border: 1px solid var(--prc-line);
	box-shadow: var(--prc-shadow);
	overflow: hidden;
}
.bl-toolbar {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 20px;
	border-bottom: 1px solid var(--prc-line-2);
}
.bl-seg {
	display: inline-flex;
	padding: 4px;
	border-radius: 999px;
	background: var(--prc-chip);
}
.bl-seg button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 36px;
	margin: 0;
	padding: 0 14px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--prc-text);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.bl-seg button:hover {
	color: var(--prc-ink);
}
.bl-seg button.is-on {
	background: #fff;
	color: var(--prc-ink);
	box-shadow: 0 1px 3px rgba(9, 32, 63, 0.14);
}
.bl-seg em {
	font-style: normal;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--prc-faint);
	font-variant-numeric: tabular-nums;
}
.bl-seg button.is-on em {
	color: var(--prc-green-text);
}
.bl-seg i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--prc-green);
}
.bl-seg i.is-down {
	background: #f59e0b;
}
.bl-sorted {
	margin-left: auto;
	font-size: 13.5px;
	color: var(--prc-muted);
	white-space: nowrap;
}

.bl-table-wrap {
	position: relative;
}
.bl-table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	table-layout: fixed;
	font-family: inherit;
}
@media (min-width: 992px) {
	.bl-table .bl-c-name { width: 34%; }
	.bl-table .bl-c-type { width: 11%; }
	.bl-table .bl-c-st { width: 16%; }
	.bl-table .bl-c-test { width: 13%; }
	.bl-table .bl-c-act { width: 12%; }
	.bl-table .bl-c-del { width: 14%; }
	.bl-table.bl-no-act .bl-c-name { width: 40%; }
	.bl-table.bl-no-act .bl-c-test { width: 16%; }
	.bl-table.bl-no-act .bl-c-del { width: 17%; }
}
.bl-table thead th {
	height: 44px;
	padding: 0 20px;
	border-bottom: 1px solid var(--prc-line);
	background: #fff;
	text-align: left;
	vertical-align: middle;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--prc-subtle);
}
.bl-table tbody th,
.bl-table tbody td {
	height: 62px;
	padding: 8px 20px;
	border-bottom: 1px solid #f0f2f5;
	text-align: left;
	vertical-align: middle;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--prc-text);
	transition: background-color 0.1s ease;
}
.bl-table tbody tr:hover th,
.bl-table tbody tr:hover td {
	background: #f8fafb;
}
.bl-table tbody tr.is-down th,
.bl-table tbody tr.is-down td {
	background: #fffaf0;
}
.bl-name {
	display: block;
	overflow: hidden;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--prc-ink);
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bl-type {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 26px;
	padding: 0 10px;
	border-radius: 999px;
	background: var(--prc-chip);
	color: #2c3743;
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
}
.bl-type .prc-i {
	width: 13px;
	height: 13px;
	color: var(--prc-subtle);
}
.bl-st {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-weight: 600;
	color: var(--prc-green-text);
	white-space: nowrap;
}
.bl-st::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--prc-green);
	box-shadow: 0 0 0 3px rgba(54, 199, 119, 0.18);
}
.bl-st.is-down {
	color: #92400e;
}
.bl-st.is-down::before {
	background: #f59e0b;
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2);
}
.bl-when {
	color: var(--prc-muted);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}
.bl-act {
	display: inline-flex;
	align-items: flex-end;
	gap: 8px;
	font-weight: 600;
	line-height: 1;
	color: var(--prc-ink);
	font-variant-numeric: tabular-nums;
	cursor: default;
}
.bl-spark {
	display: inline-flex;
	align-items: flex-end;
	gap: 2px;
	height: 20px;
}
.bl-spark i {
	width: 4px;
	border-radius: 1px;
	background: #c9d3de;
}
.bl-del,
.bl-del:focus {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	color: var(--prc-green-text);
	text-decoration: none;
	white-space: nowrap;
}
.bl-del:hover {
	color: var(--prc-green-dark);
	text-decoration: underline;
}
.bl-del .prc-i {
	width: 13px;
	height: 13px;
	stroke-width: 2.4;
}
.bl-table-wrap.is-collapsed tbody tr.is-more {
	display: none;
}
.bl-table-wrap.is-collapsed::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 130px;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 90%);
	pointer-events: none;
}
.bl-more {
	display: flex;
	justify-content: center;
	padding: 4px 0 26px;
}
.bl-more .prc-btn {
	height: 46px;
	font-size: 14.5px;
}
.bl-more .prc-i {
	width: 16px;
	height: 16px;
}
.bl-empty {
	margin: 0;
	padding: 40px 20px;
	text-align: center;
	font-size: 15px;
	color: var(--prc-muted);
}

.bl-active {
	padding: 104px 0;
	background: #fff;
}
.bl-active-grid {
	display: grid;
	grid-template-columns: 380px minmax(0, 1fr);
	gap: 72px;
	align-items: start;
}
.bl-active-intro p {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.65;
	color: var(--prc-muted);
}
.bl-bars {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--prc-line-2);
}
.bl-bar-row {
	display: grid;
	grid-template-columns: 28px 230px minmax(0, 1fr) 70px;
	align-items: center;
	gap: 16px;
	height: 58px;
	border-bottom: 1px solid var(--prc-line-2);
}
.bl-rank {
	font-size: 13px;
	font-weight: 700;
	color: var(--prc-faint);
	font-variant-numeric: tabular-nums;
}
.bl-bar-name {
	min-width: 0;
}
.bl-bar-name strong {
	display: block;
	overflow: hidden;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--prc-ink);
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bl-bar-name span {
	display: block;
	font-size: 12px;
	line-height: 1.4;
	color: var(--prc-subtle);
}
.bl-track {
	height: 10px;
	border-radius: 999px;
	background: var(--prc-chip);
	overflow: hidden;
}
.bl-track i {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: linear-gradient(to right, #1f3b5c, var(--prc-navy));
}
.bl-bar-row:first-child .bl-track i {
	background: linear-gradient(to right, var(--prc-green-dark), var(--prc-green));
}
.bl-bar-val {
	text-align: right;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--prc-ink);
	font-variant-numeric: tabular-nums;
}

.bl .prc-faq-a .prc-linkbtn {
	font-weight: 600;
	color: var(--prc-green-text);
}

.bl-perks {
	padding: 104px 0 0;
	background: #fff;
	border-top: 1px solid var(--prc-line-2);
}
.bl-perks .prc-sec-head > div {
	max-width: 640px;
}
.bl-perks .prc-feats {
	margin-top: 48px;
}

@media (max-width: 1199px) {
	.bl-active-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.bl-table .bl-c-name { width: 33%; }
	.bl-table .bl-c-test { width: 14%; }
	.bl-table thead th,
	.bl-table tbody th,
	.bl-table tbody td {
		padding-left: 14px;
		padding-right: 14px;
	}
	.bl-type .prc-i {
		display: none;
	}
}

@media (max-width: 991px) {
	.bl-title {
		font-size: 44px;
	}
	.bl-toolbar {
		flex-wrap: wrap;
	}
	.bl-table,
	.bl-table tbody,
	.bl-table tr,
	.bl-table th,
	.bl-table td {
		display: block;
		width: 100%;
	}
	.bl-table thead {
		display: none;
	}
	.bl-table tbody tr {
		position: relative;
		padding: 14px 16px;
		border-bottom: 1px solid #f0f2f5;
	}
	.bl-table tbody tr.is-down {
		background: #fffaf0;
	}
	.bl-table tbody th,
	.bl-table tbody td,
	.bl-table tbody tr:hover th,
	.bl-table tbody tr:hover td,
	.bl-table tbody tr.is-down th,
	.bl-table tbody tr.is-down td {
		width: auto;
		height: auto;
		padding: 0;
		border: 0;
		background: transparent;
	}
	.bl-table tbody .bl-c-name {
		padding-right: 120px;
	}
	.bl-table tbody .bl-c-type,
	.bl-table tbody .bl-c-act {
		display: none;
	}
	.bl-table tbody .bl-c-st {
		position: absolute;
		top: 14px;
		right: 16px;
		font-size: 13px;
	}
	.bl-table tbody .bl-c-test,
	.bl-table tbody .bl-c-del {
		display: inline-block;
		margin-top: 6px;
		font-size: 13px;
	}
	.bl-table tbody .bl-c-test {
		margin-right: 14px;
	}
}

@media (max-width: 767px) {
	.bl-hero.prc-hero {
		padding-top: 104px;
		padding-bottom: 120px;
	}
	.bl-crumbs {
		font-size: 12.5px;
	}
	.bl-title {
		margin-top: 20px;
		font-size: 34px;
	}
	.bl-lead {
		font-size: 16.5px;
	}
	.bl-search {
		height: 54px;
		margin-top: 28px;
		padding-left: 18px;
	}
	.bl-search input {
		font-size: 16px;
	}
	.bl-kbd {
		display: none;
	}
	.bl-stats {
		gap: 8px 18px;
		font-size: 13.5px;
	}
	.bl-stats li:last-child {
		display: none;
	}
	.bl-dir {
		padding-bottom: 64px;
	}
	.bl-card {
		margin-top: -64px;
		border-radius: 16px;
	}
	.bl-toolbar {
		padding: 14px;
		gap: 10px;
	}
	.bl-seg {
		width: 100%;
	}
	.bl-seg button {
		flex: 1;
		justify-content: center;
		gap: 6px;
		padding: 0 6px;
		font-size: 13px;
	}
	.bl-seg button:first-child em,
	.bl-sorted {
		display: none;
	}
	.bl-active {
		padding: 72px 0;
	}
	.bl-bar-row {
		grid-template-columns: 22px minmax(0, 1fr) 56px;
		grid-template-rows: auto auto;
		row-gap: 6px;
		height: auto;
		padding: 12px 0;
	}
	.bl-bar-row .bl-track {
		grid-column: 2 / 4;
		grid-row: 2;
	}
	.bl-perks {
		padding-top: 72px;
	}
	.bl-perks .prc-feats {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		margin-top: 28px;
	}
	.bl-perks .prc-feat {
		display: grid;
		grid-template-columns: 40px minmax(0, 1fr);
		align-items: start;
		column-gap: 14px;
		row-gap: 2px;
	}
	.bl-perks .prc-feat-icon {
		grid-row: span 2;
		width: 40px;
		height: 40px;
		border-radius: 11px;
	}
	.bl-perks .prc-feat-title {
		font-size: 15.5px;
	}
	.bl-perks .prc-feat-text {
		display: block;
		font-size: 14px;
	}
}