/* Web Archive restore tool (feature/wayback-restore). Same card language as the other tools. */
.tt-wbr-card {
	display: grid;
	gap: 24px;
	padding: 20px;
	border: 1px solid var(--tt-reports-line, #eef0f2);
	border-radius: 24px;
	background: #fff;
	color: #15171a;
}

@media (min-width: 768px) {
	.tt-wbr-card { padding: 30px; border-radius: 30px; }
}

.tt-wbr-form { position: relative; display: grid; gap: 18px; }
.tt-wbr-fields { display: grid; gap: 14px; }

@media (min-width: 900px) {
	.tt-wbr-fields { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); }
}

.tt-wbr-field { display: grid; gap: 6px; align-content: start; min-width: 0; }
.tt-wbr-field small,
.tt-wbr-check small,
.tt-wbr-hint { font-size: 13px; line-height: 1.45; color: #6b7280; }
.tt-wbr-label { font-size: 14px; font-weight: 600; }

.tt-wbr-input {
	width: 100%;
	min-height: 50px;
	padding: 0 16px;
	border: 1px solid #dfe3e8;
	border-radius: 12px;
	background: #fafbfc;
	color: inherit;
	font: 15px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tt-wbr-input:focus { outline: 2px solid #ff5a36; outline-offset: 1px; background: #fff; }

.tt-wbr-options { display: grid; gap: 12px; padding: 14px 16px; border: 1px solid #eef0f2; border-radius: 16px; }
.tt-wbr-options > summary { font-size: 15px; font-weight: 600; cursor: pointer; }
.tt-wbr-options[open] > summary { margin-bottom: 10px; }
.tt-wbr-grid { display: grid; gap: 10px; }

@media (min-width: 768px) {
	.tt-wbr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.tt-wbr-group { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 6px 0 0; padding: 0; border: 0; }
.tt-wbr-group legend { width: 100%; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
.tt-wbr-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.45; cursor: pointer; }
.tt-wbr-check input { flex: none; width: 18px; height: 18px; margin-top: 1px; accent-color: #ff5a36; }
.tt-wbr-check small { display: block; }

.tt-wbr-submit { display: grid; gap: 10px; justify-items: start; }

.tt-wbr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 0 28px;
	border: 0;
	border-radius: 10px;
	background: var(--tt-reports-grad, linear-gradient(90deg, #ff5a36, #ff8a3d));
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}

.tt-wbr-btn:disabled { opacity: 0.6; cursor: progress; }
.tt-wbr-note { font-size: 14px; color: #d92d20; }

.tt-wbr-progress { display: grid; gap: 10px; }
.tt-wbr-progress-title,
.tt-wbr-result-title { font-size: 18px; font-weight: 600; word-break: break-word; }
.tt-wbr-result-title.is-failed { color: #b91c1c; }
.tt-wbr-bar { height: 10px; overflow: hidden; border-radius: 999px; background: #f1f3f5; }
.tt-wbr-bar > span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ff5a36, #ff8a3d); transition: width 0.6s ease; }

.tt-wbr-result { display: grid; gap: 12px; justify-items: start; }
.tt-wbr-pass { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 14px; }
.tt-wbr-pass code { padding: 4px 8px; border-radius: 8px; background: #f6f7f9; font: 14px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; }
.tt-wbr-line { font-size: 15px; line-height: 1.5; }
.tt-wbr-line.is-ok { color: #15803d; }
.tt-wbr-line.is-warn { color: #b45309; }
.tt-wbr-list { margin: 0; padding-left: 20px; font-size: 14px; list-style: disc; }
.tt-wbr-samples { font-size: 13px; color: #6b7280; }
.tt-wbr-samples summary { cursor: pointer; }
.tt-wbr-samples ul { margin-top: 6px; padding-left: 18px; list-style: disc; word-break: break-all; }

.tt-wbr-chip {
	padding: 6px 12px;
	border: 1px solid #dfe3e8;
	border-radius: 999px;
	background: #fafbfc;
	color: #15171a;
	font-size: 13px;
	cursor: pointer;
}

.tt-wbr-quota { display: grid; gap: 10px; justify-items: start; padding: 18px; border-radius: 16px; background: #fff6f2; }
.tt-wbr-quota-title { font-size: 16px; font-weight: 600; }

.tt-wbr-howto { font-size: 14px; color: #4b5563; }
.tt-wbr-howto > summary { width: fit-content; color: #6b7280; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.tt-wbr-howto ol { display: grid; gap: 6px; margin-top: 10px; padding-left: 20px; list-style: decimal; }

html[data-theme="dark"] .tt-wbr-card { background: #16181c; border-color: #2a2e35; color: #f3f4f6; }
html[data-theme="dark"] .tt-wbr-input,
html[data-theme="dark"] .tt-wbr-chip,
html[data-theme="dark"] .tt-wbr-pass code { background: #1d2025; border-color: #2f343c; color: #f3f4f6; }
html[data-theme="dark"] .tt-wbr-options { border-color: #2a2e35; }
html[data-theme="dark"] .tt-wbr-bar { background: #2a2e35; }
html[data-theme="dark"] .tt-wbr-quota { background: #241a17; }
html[data-theme="dark"] .tt-wbr-howto { color: #c7cbd1; }
html[data-theme="dark"] .tt-wbr-field small,
html[data-theme="dark"] .tt-wbr-check small,
html[data-theme="dark"] .tt-wbr-hint,
html[data-theme="dark"] .tt-wbr-samples { color: #9aa1ad; }