/* VDD AI Search Audit v1.0.0 — Origin-inspired dark editorial console */

.vdd-aisa {
	--aisa-bg: #0a0a09;
	--aisa-card: #131210;
	--aisa-border: #2a2721;
	--aisa-text: #f2ede3;
	--aisa-dim: #a39b8d;
	--aisa-accent: #e8b34b;
	--aisa-pass: #5fc48f;
	--aisa-warn: #e8b34b;
	--aisa-fail: #e56a5b;
	background: var(--aisa-bg);
	color: var(--aisa-text);
	border-radius: 20px;
	padding: 56px 48px;
	font-family: -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
	line-height: 1.6;
}

.vdd-aisa * {
	box-sizing: border-box;
}

.vdd-aisa-eyebrow {
	font-family: "SF Mono", "Cascadia Code", Consolas, Menlo, monospace;
	font-size: 11px;
	letter-spacing: 0.18em;
	color: var(--aisa-dim);
	text-transform: uppercase;
	margin-bottom: 14px;
}

.vdd-aisa-title {
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(34px, 5vw, 56px);
	font-weight: 500;
	color: var(--aisa-text);
	margin: 0 0 14px;
	line-height: 1.1;
}

.vdd-aisa-title em {
	font-style: italic;
	font-weight: 400;
}

.vdd-aisa-sub {
	color: var(--aisa-dim);
	max-width: 560px;
	margin: 0 0 32px;
	font-size: 16px;
}

.vdd-aisa-form {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.vdd-aisa-input {
	flex: 1 1 320px;
	background: var(--aisa-card);
	border: 1px solid var(--aisa-border);
	border-radius: 999px;
	color: var(--aisa-text);
	padding: 15px 24px;
	font-size: 15px;
	outline: none;
	transition: border-color 0.2s ease;
}

.vdd-aisa-input:focus {
	border-color: var(--aisa-accent);
}

.vdd-aisa-input::placeholder {
	color: #5c564d;
}

.vdd-aisa-btn {
	background: #ffffff;
	color: #0a0a09;
	border: none;
	border-radius: 999px;
	padding: 15px 28px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: transform 0.15s ease, opacity 0.15s ease;
}

.vdd-aisa-btn:hover {
	transform: translateY(-1px);
}

.vdd-aisa-btn:disabled {
	opacity: 0.5;
	cursor: wait;
	transform: none;
}

.vdd-aisa-arrow {
	display: inline-block;
	margin-left: 6px;
	transition: transform 0.15s ease;
}

.vdd-aisa-btn:hover .vdd-aisa-arrow {
	transform: translateX(3px);
}

.vdd-aisa-status {
	font-family: "SF Mono", Consolas, Menlo, monospace;
	font-size: 13px;
	color: var(--aisa-dim);
	padding: 14px 0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.vdd-aisa-status.is-error {
	color: var(--aisa-fail);
}

.vdd-aisa-spinner {
	width: 14px;
	height: 14px;
	border: 2px solid var(--aisa-border);
	border-top-color: var(--aisa-accent);
	border-radius: 50%;
	animation: vdd-aisa-spin 0.8s linear infinite;
	flex: 0 0 auto;
}

@keyframes vdd-aisa-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Report */

.vdd-aisa-report {
	margin-top: 36px;
}

.vdd-aisa-summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 28px;
	background: var(--aisa-card);
	border: 1px solid var(--aisa-border);
	border-radius: 16px;
	padding: 32px;
	margin-bottom: 24px;
	background-image: radial-gradient(ellipse 60% 80% at 85% 20%, rgba(232, 179, 75, 0.07), transparent);
}

.vdd-aisa-summary-url {
	font-family: "SF Mono", Consolas, Menlo, monospace;
	font-size: 14px;
	color: var(--aisa-accent);
	word-break: break-all;
	margin-bottom: 10px;
}

.vdd-aisa-summary-verdict {
	font-family: Georgia, serif;
	font-size: 19px;
	max-width: 520px;
	line-height: 1.45;
}

.vdd-aisa-summary-right {
	text-align: center;
	flex: 0 0 auto;
}

.vdd-aisa-grade {
	font-family: "SF Mono", Consolas, Menlo, monospace;
	font-size: 11px;
	letter-spacing: 0.15em;
	color: var(--aisa-dim);
	margin-top: 10px;
	text-transform: uppercase;
}

.vdd-aisa-ring {
	--deg: 0deg;
	width: 92px;
	height: 92px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: conic-gradient(var(--aisa-ring-color, var(--aisa-accent)) var(--deg), #22201b var(--deg));
	position: relative;
	flex: 0 0 auto;
}

.vdd-aisa-ring::before {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 50%;
	background: var(--aisa-card);
}

.vdd-aisa-ring span {
	position: relative;
	font-size: 26px;
	font-weight: 700;
	font-family: Georgia, serif;
}

.vdd-aisa-ring.is-good {
	--aisa-ring-color: var(--aisa-pass);
}

.vdd-aisa-ring.is-mid {
	--aisa-ring-color: var(--aisa-warn);
}

.vdd-aisa-ring.is-poor {
	--aisa-ring-color: var(--aisa-fail);
}

/* Pillar cards */

.vdd-aisa-pillar {
	background: var(--aisa-card);
	border: 1px solid var(--aisa-border);
	border-radius: 16px;
	padding: 28px 32px;
	margin-bottom: 18px;
}

.vdd-aisa-pillar-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 20px;
	margin-bottom: 18px;
}

.vdd-aisa-pillar-head .vdd-aisa-ring {
	width: 72px;
	height: 72px;
}

.vdd-aisa-pillar-head .vdd-aisa-ring span {
	font-size: 20px;
}

.vdd-aisa-pillar-name {
	font-family: Georgia, serif;
	font-size: 26px;
	font-weight: 500;
	margin: 0 0 4px;
	color: var(--aisa-text);
}

.vdd-aisa-pillar-name em {
	font-style: italic;
	font-weight: 400;
}

.vdd-aisa-pillar-q {
	color: var(--aisa-dim);
	font-size: 14px;
}

.vdd-aisa-checks {
	border-top: 1px solid var(--aisa-border);
	padding-top: 18px;
	display: grid;
	gap: 16px;
}

.vdd-aisa-check {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}

.vdd-aisa-ic {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
	margin-top: 2px;
}

.vdd-aisa-ic.is-pass {
	background: rgba(95, 196, 143, 0.14);
	color: var(--aisa-pass);
}

.vdd-aisa-ic.is-warn {
	background: rgba(232, 179, 75, 0.14);
	color: var(--aisa-warn);
}

.vdd-aisa-ic.is-fail {
	background: rgba(229, 106, 91, 0.14);
	color: var(--aisa-fail);
}

.vdd-aisa-check-label {
	font-weight: 600;
	font-size: 15px;
	margin-bottom: 2px;
}

.vdd-aisa-check-detail {
	color: var(--aisa-dim);
	font-size: 13.5px;
}

.vdd-aisa-check-tip {
	margin-top: 6px;
	font-size: 13.5px;
	color: var(--aisa-text);
	border-left: 2px solid var(--aisa-accent);
	padding-left: 12px;
}

.vdd-aisa-check-tip span {
	color: var(--aisa-accent);
	font-weight: 600;
}

/* Importance section */

.vdd-aisa-importance {
	background: var(--aisa-card);
	border: 1px solid var(--aisa-border);
	border-radius: 16px;
	padding: 28px 32px;
	margin-bottom: 24px;
	background-image: radial-gradient(ellipse 50% 70% at 10% 90%, rgba(95, 196, 143, 0.05), transparent);
}

.vdd-aisa-imp h4 {
	font-family: Georgia, serif;
	font-size: 18px;
	font-weight: 500;
	margin: 18px 0 6px;
	color: var(--aisa-text);
}

.vdd-aisa-imp p {
	color: var(--aisa-dim);
	font-size: 14px;
	margin: 0;
}

.vdd-aisa-actions {
	text-align: center;
	padding: 8px 0 4px;
}

/* Hidden PDF staging area */

.vdd-aisa-pdf-stage {
	position: absolute;
	left: -9999px;
	top: 0;
	width: 186mm;
}

@media (max-width: 640px) {
	.vdd-aisa {
		padding: 36px 22px;
		border-radius: 14px;
	}

	.vdd-aisa-summary {
		flex-direction: column;
		align-items: flex-start;
	}

	.vdd-aisa-pillar-head {
		flex-direction: column-reverse;
	}
}
