/**
 * TTC FAQ Block Styles
 *
 * Component-only styles for the FAQ block.
 * Page layout styles (.ttc-faq-page) remain in child theme.
 */

/* FAQ List - Main Container */
.ttc-faq-list {
	width: min(100%, 800px);
	counter-reset: ttc-faq;
}

/* FAQ Item - Details Element */
.ttc-faq-list details {
	counter-increment: ttc-faq;
	margin-bottom: 0.65rem;
	border-radius: 8px;
	background: #fff;
	opacity: 0.925;
	color: var(--ttc-text);
	box-shadow: 0 3px 12px rgb(0 0 0 / 8%);
	overflow: hidden;
}

/* FAQ Question - Summary Element */
.ttc-faq-list summary {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.45rem;
	margin: 0;
	min-height: 62px;
	padding: 1rem 1.45rem;
	color: var(--ttc-text);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	cursor: pointer;
	list-style: none;
}

.ttc-faq-list summary::-webkit-details-marker {
	display: none;
}

/* Question Number */
.ttc-faq-list summary::before {
	content: counter(ttc-faq) ".";
}

/* Expand/Collapse Icon */
.ttc-faq-list summary::after {
	content: "+";
	color: #9b9da3;
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 1;
}

.ttc-faq-list details[open] summary {
	padding-bottom: 0.45rem;
}

.ttc-faq-list details[open] summary::after {
	content: "−";
	color: var(--ttc-text);
}

/* FAQ Answer Container */
.ttc-faq-answer {
	padding: 0 1.45rem 1.15rem;
	color: #5e6067;
	font-size: 0.875rem;
	line-height: 1.55;
}

.ttc-faq-answer p {
	margin: 0 0 0.35rem;
	color: inherit !important;
}

.ttc-faq-answer p:last-child,
.ttc-faq-answer ul:last-child {
	margin-bottom: 0;
}

.ttc-faq-answer ul {
	margin: 0;
	padding-left: 1.15rem;
}

/* FAQ List Group Block */
.ttc-faq-list.wp-block-group {
	width: min(100%, 800px);
	margin-inline: auto;
}

/* Responsive */
@media (max-width: 768px) {
	.ttc-faq-list summary {
		min-height: 58px;
		padding: 0.85rem 1rem;
		font-size: 0.875rem;
	}

	.ttc-faq-answer {
		padding: 0 1rem 1rem;
		font-size: 0.8rem;
	}
}