﻿.project-ai-question-packs {
	border-bottom: 1px solid var(--chat-soft-line);
	margin: .2rem 0 1rem;
	padding: 0 0 1.2rem;
	width: 100%;
}

.project-ai-question-packs > header {
	align-items: end;
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: .75rem;
}

.project-ai-question-packs > header h3 {
	font-size: 1rem;
	font-weight: 700;
	margin: 0;
}

.project-ai-question-packs > header p:not(.project-ai-chat__eyebrow) {
	color: var(--chat-muted);
	font-size: .75rem;
	line-height: 1.45;
	margin: .25rem 0 0;
}

.project-ai-question-packs > header > small {
	align-items: center;
	color: var(--chat-muted);
	display: inline-flex;
	font-size: .65rem;
	gap: .3rem;
	max-width: 14rem;
}

.project-ai-question-packs__grid {
	display: grid;
	gap: .55rem;
	grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
}

.project-ai-question-pack {
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--chat-accent-soft) 60%, transparent), transparent 55%),
		var(--chat-canvas);
	border: 1px solid var(--chat-soft-line);
	border-radius: .75rem;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	min-height: 6.2rem;
	overflow: hidden;
	position: relative;
	transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.project-ai-question-pack:hover,
.project-ai-question-pack:focus-within {
	border-color: color-mix(in srgb, var(--chat-accent) 45%, var(--chat-line));
	box-shadow: 0 .4rem 1.2rem color-mix(in srgb, var(--chat-accent) 10%, transparent);
	transform: translateY(-1px);
}

.project-ai-question-pack.is-favorite {
	border-left: .28rem solid var(--chat-accent);
	order: -1;
}

.project-ai-question-pack__open {
	align-items: start;
	background: transparent;
	border: 0;
	display: grid;
	gap: .65rem;
	grid-template-columns: auto minmax(0, 1fr) auto;
	min-width: 0;
	padding: .8rem .35rem .8rem .8rem;
	text-align: left;
}

.project-ai-question-pack__open > span:nth-child(2) {
	display: grid;
	gap: .25rem;
	min-width: 0;
}

.project-ai-question-pack__open strong {
	font-size: .79rem;
	line-height: 1.25;
}

.project-ai-question-pack__open small {
	color: var(--chat-muted);
	font-size: .68rem;
	line-height: 1.45;
}

.project-ai-question-pack__open > .bi {
	color: var(--chat-accent-dark);
	font-size: .72rem;
	margin-top: .2rem;
}

.project-ai-question-pack__icon {
	align-items: center;
	background: var(--chat-accent-soft);
	border: 1px solid color-mix(in srgb, var(--chat-accent) 22%, var(--chat-line));
	border-radius: .55rem;
	color: var(--chat-accent-dark);
	display: inline-flex;
	font-size: .9rem;
	height: 2rem;
	justify-content: center;
	width: 2rem;
}

.project-ai-question-pack__favorite {
	align-self: start;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: var(--chat-muted);
	height: 2rem;
	margin: .45rem .4rem 0 0;
	width: 2rem;
}

.project-ai-question-pack__favorite:hover,
.project-ai-question-pack__favorite:focus-visible,
.project-ai-question-pack__favorite[aria-pressed="true"] {
	background: var(--chat-accent-soft);
	color: var(--chat-accent-dark);
}

.project-ai-question-pack-modal {
	--pack-line: var(--ztm-border-base);
	--pack-soft: var(--ztm-bg-subtle);
	--pack-muted: var(--ztm-text-muted);
}

.project-ai-question-pack-preview {
	background: var(--pack-soft);
	border: 1px solid var(--pack-line);
	border-radius: .8rem;
	padding: 1rem;
}

.project-ai-question-pack-preview h3 {
	font-size: 1rem;
	margin: 0 0 .35rem;
}

.project-ai-question-pack-preview > p {
	color: var(--pack-muted);
	font-size: .82rem;
	margin: 0 0 1rem;
}

.project-ai-question-pack-preview__facts,
.project-ai-question-pack-result__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.project-ai-question-pack-preview__facts span,
.project-ai-question-pack-result__meta span,
.project-ai-question-pack-result__counts span {
	align-items: center;
	background: var(--ztm-bg-content);
	border: 1px solid var(--pack-line);
	border-radius: 999px;
	display: inline-flex;
	font-size: .7rem;
	gap: .35rem;
	padding: .3rem .55rem;
}

.project-ai-question-pack-running {
	align-items: center;
	color: var(--pack-muted);
	display: flex;
	justify-content: center;
	min-height: 14rem;
}

.project-ai-question-pack-running::before {
	animation: question-pack-spin 800ms linear infinite;
	border: .18rem solid var(--pack-line);
	border-radius: 50%;
	border-top-color: var(--ztm-accent-solid);
	content: "";
	height: 1.5rem;
	margin-right: .65rem;
	width: 1.5rem;
}

@keyframes question-pack-spin {
	to { transform: rotate(360deg); }
}

.project-ai-question-pack-result {
	display: grid;
	gap: .85rem;
	margin-top: 1rem;
}

.project-ai-question-pack-result__step {
	border: 1px solid var(--pack-line);
	border-left: .28rem solid var(--ztm-status-success);
	border-radius: .65rem;
	padding: .85rem;
}

.project-ai-question-pack-result__step.is-empty,
.project-ai-question-pack-result__step.is-limited {
	border-left-color: var(--ztm-status-warning);
}

.project-ai-question-pack-result__step.is-unavailable {
	border-left-color: var(--ztm-status-error);
}

.project-ai-question-pack-result__step > header {
	align-items: center;
	display: grid;
	gap: .65rem;
	grid-template-columns: auto minmax(0, 1fr) auto;
}

.project-ai-question-pack-result__step > header > i {
	color: var(--ztm-accent-text);
	font-size: 1.15rem;
}

.project-ai-question-pack-result__step h3 {
	font-size: .9rem;
	margin: 0;
}

.project-ai-question-pack-result__step header div > span {
	color: var(--pack-muted);
	font-size: .67rem;
}

.project-ai-question-pack-result__counts {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	justify-content: end;
}

.project-ai-question-pack-result__note {
	background: color-mix(in srgb, var(--ztm-status-warning) 10%, var(--ztm-bg-content));
	border-radius: .4rem;
	font-size: .72rem;
	margin: .7rem 0 0;
	padding: .5rem .6rem;
}

.project-ai-question-pack-table {
	margin-top: .7rem;
	overflow-x: auto;
}

.project-ai-question-pack-table table {
	font-size: .7rem;
}

.project-ai-question-pack-table th {
	white-space: nowrap;
}

.project-ai-question-pack-table__limit {
	color: var(--pack-muted);
	display: block;
	font-size: .65rem;
	padding-top: .35rem;
}

.project-ai-question-pack-result__ask {
	margin-top: .7rem;
}

@media (max-width: 767.98px) {
	.project-ai-question-packs > header {
		align-items: start;
		flex-direction: column;
	}

	.project-ai-question-packs__grid {
		grid-template-columns: 1fr;
	}

	.project-ai-question-pack-result__step > header {
		grid-template-columns: auto minmax(0, 1fr);
	}

	.project-ai-question-pack-result__counts {
		grid-column: 1 / -1;
		justify-content: start;
	}
}

@media (prefers-reduced-motion: reduce) {
	.project-ai-question-pack,
	.project-ai-question-pack-running::before {
		animation: none;
		transition: none;
	}
}

.project-home-question-packs {
	margin-bottom: 2rem;
}

.project-home-question-packs > header {
	align-items: end;
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: .8rem;
}

.project-home-question-packs__grid {
	display: grid;
	gap: .75rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-home-question-pack {
	align-items: start;
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--ztm-accent-wash) 75%, transparent), transparent 58%),
		var(--ztm-bg-content);
	border: 1px solid var(--ztm-border-base);
	border-radius: var(--ztm-radius-panel);
	color: var(--ztm-text-primary);
	display: grid;
	gap: .7rem;
	grid-template-columns: auto minmax(0, 1fr) auto;
	min-height: 7rem;
	padding: .9rem;
	text-decoration: none;
	transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.project-home-question-pack:hover,
.project-home-question-pack:focus-visible {
	border-color: var(--ztm-accent-solid);
	box-shadow: var(--ztm-shadow-popover);
	color: var(--ztm-text-primary);
	transform: translateY(-1px);
}

.project-home-question-pack > span:first-child {
	align-items: center;
	background: var(--ztm-accent-wash);
	border-radius: .55rem;
	color: var(--ztm-accent-text);
	display: inline-flex;
	height: 2.2rem;
	justify-content: center;
	width: 2.2rem;
}

.project-home-question-pack > span:nth-child(2) {
	display: grid;
	gap: .3rem;
}

.project-home-question-pack strong {
	font-size: .85rem;
}

.project-home-question-pack small {
	color: var(--ztm-text-muted);
	font-size: .72rem;
	line-height: 1.45;
}

.project-home-question-pack > .bi {
	color: var(--ztm-accent-text);
	font-size: .72rem;
}

@media (max-width: 991.98px) {
	.project-home-question-packs__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 575.98px) {
	.project-home-question-packs > header {
		align-items: start;
		flex-direction: column;
	}
}
