/* 网盘链接巡检 —— 前端展示样式
 *
 * 这一份同时给两处用：
 *   1. 正文末尾的服务端直出块（append_inline），SEO 抓得到；
 *   2. 运行时插件模块 guaqi.module.linkCheck（builder 放到详情页模板里）。
 * 两处共用同一套类名与配色，避免同页两块东西长得不一样。
 *
 * 配色口径与后台一致：绿=可用、红=失效、橙=需人工、灰=未填写/异常。
 * 主色点缀走站点自身的 --el-color-primary（缺省回退 #00C29A），
 * 这样换主题时不用改这份文件。
 */

.gqlc-inline,
.gqlc-panel {
	--gqlc-ok: #0f9d58;
	--gqlc-dead: #e5484d;
	--gqlc-unknown: #d98a00;
	--gqlc-none: #8b8fa3;
	--gqlc-line: rgba(0, 0, 0, .08);
	--gqlc-text: #1f2421;
	--gqlc-text-2: #5f5e5a;
	--gqlc-text-3: #8c8f94;
	--gqlc-bg: #fff;
	box-sizing: border-box;
	color: var(--gqlc-text);
	font-size: 14px;
	line-height: 1.7;
}

.dark .gqlc-inline,
.dark .gqlc-panel,
[data-theme="dark"] .gqlc-inline,
[data-theme="dark"] .gqlc-panel {
	--gqlc-line: rgba(255, 255, 255, .12);
	--gqlc-text: rgba(255, 255, 255, .88);
	--gqlc-text-2: rgba(255, 255, 255, .62);
	--gqlc-text-3: rgba(255, 255, 255, .45);
	--gqlc-bg: transparent;
}

.gqlc-inline *,
.gqlc-panel * {
	box-sizing: border-box;
}

/* ---------------------------------------------------------------- 正文内联块 */

.gqlc-inline {
	margin: 26px 0 8px;
	padding: 16px 18px;
	border: 1px solid var(--gqlc-line);
	border-radius: 10px;
	background: var(--gqlc-bg);
}

.gqlc-inline-head {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 10px;
}

.gqlc-inline-title {
	font-size: 15px;
	font-weight: 600;
}

.gqlc-inline-sum {
	font-size: 12.5px;
	color: var(--gqlc-text-2);
}

.gqlc-inline-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.gqlc-il {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 5px 11px;
	border: 1px solid var(--gqlc-line);
	border-radius: 999px;
	font-size: 13px;
	background: transparent;
}

.gqlc-il-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	flex: 0 0 auto;
}

.gqlc-il-name {
	font-weight: 500;
}

.gqlc-il-note {
	color: var(--gqlc-text-2);
	font-size: 12px;
}

.gqlc-il--dead .gqlc-il-name,
.gqlc-il--empty .gqlc-il-name {
	color: var(--gqlc-dead);
}

.gqlc-il--unknown .gqlc-il-name {
	color: var(--gqlc-unknown);
}

.gqlc-inline-foot {
	margin: 12px 0 0;
	font-size: 12px;
	color: var(--gqlc-text-3);
	line-height: 1.6;
}

/* ---------------------------------------------------------------- 前端模块面板 */

.gqlc-panel {
	padding: 18px 20px;
	border: 1px solid var(--gqlc-line);
	border-radius: 12px;
	background: var(--gqlc-bg);
}

.gqlc-p-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 4px;
}

.gqlc-p-title {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	font-weight: 600;
}

.gqlc-p-title svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
}

.gqlc-p-sub {
	font-size: 12.5px;
	color: var(--gqlc-text-2);
}

.gqlc-p-bars {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 12px 0 14px;
}

.gqlc-p-bar {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 6px;
	font-size: 12.5px;
	border: 1px solid var(--gqlc-line);
}

.gqlc-p-bar b {
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.gqlc-p-bar i {
	font-style: normal;
}

/* 整体结论徽标：颜色即结论，文字只做补充 —— 只靠颜色区分会让色弱读者读不出差别，
   所以它始终带文字，没有纯色圆点版本。 */
.gqlc-p-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 1.6;
}

.gqlc-p-badge--healthy {
	color: var(--gqlc-ok);
}

.gqlc-p-badge--warn {
	color: var(--gqlc-unknown);
}

.gqlc-p-badge--broken,
.gqlc-p-badge--all-broken {
	color: var(--gqlc-dead);
}

.gqlc-p-badge--none {
	color: var(--gqlc-none);
}

.gqlc-p-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}

.gqlc-p-item {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--gqlc-line);
	border-radius: 8px;
}

.gqlc-p-mark {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	margin-top: 3px;
}

.gqlc-p-main {
	min-width: 0;
	flex: 1;
}

.gqlc-p-name {
	font-weight: 500;
	font-size: 13.5px;
	word-break: break-word;
}

.gqlc-p-note {
	font-size: 12px;
	color: var(--gqlc-text-2);
	margin-top: 1px;
}

.gqlc-p-item--dead .gqlc-p-name,
.gqlc-p-item--empty .gqlc-p-name {
	color: var(--gqlc-dead);
}

.gqlc-p-item--unknown .gqlc-p-name {
	color: var(--gqlc-unknown);
}

.gqlc-p-foot {
	margin: 14px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--gqlc-line);
	font-size: 12px;
	color: var(--gqlc-text-3);
	line-height: 1.65;
}

.gqlc-p-empty {
	margin: 0;
	color: var(--gqlc-text-3);
	font-size: 13px;
}

/* ---------------------------------------------------------------- 前端模块：状态标记与计数条 */

/* 标记统一走描边（不用填充），所以颜色只能落在 stroke 上，不能靠继承 color --
   .gqlc-p-item--dead 上的 color 只作用于名字文字，套到标记上会让图标糊成一团。 */
.gqlc-p-icon,
.gqlc-p-mark {
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.gqlc-p-icon {
	stroke: var(--el-color-primary, #00c29a);
}

.gqlc-p-item--ok .gqlc-p-mark {
	stroke: var(--gqlc-ok);
}

.gqlc-p-item--dead .gqlc-p-mark {
	stroke: var(--gqlc-dead);
}

.gqlc-p-item--unknown .gqlc-p-mark {
	stroke: var(--gqlc-unknown);
}

.gqlc-p-item--empty .gqlc-p-mark,
.gqlc-p-item--error .gqlc-p-mark {
	stroke: var(--gqlc-none);
}

.gqlc-p-bar--ok b {
	color: var(--gqlc-ok);
}

.gqlc-p-bar--dead b {
	color: var(--gqlc-dead);
}

.gqlc-p-bar--unknown b {
	color: var(--gqlc-unknown);
}

.gqlc-p-bar--empty b,
.gqlc-p-bar--error b {
	color: var(--gqlc-none);
}

/* 窄屏：下载点两列改一列，避免长名字把卡片挤变形 */
@media (max-width: 767px) {
	.gqlc-p-list {
		grid-template-columns: minmax(0, 1fr);
	}

	.gqlc-panel {
		padding: 15px 14px;
	}

	.gqlc-inline {
		padding: 13px 14px;
	}

	.gqlc-il {
		padding: 4px 9px;
		font-size: 12.5px;
	}
}