/* =========================================================
   Pro Accordion Widget - Frontend Styles
   ========================================================= */

/* Wrapper */
.paw-accordion-wrapper {
	width: 100%;
}

/* Hidden items (Show More feature) */
.paw-accordion-item.paw-hidden-item {
	display: none !important;
}

/* Item */
.paw-accordion-item {
	overflow: hidden;
	transition: box-shadow 0.2s ease;
}

/* Header */
.paw-accordion-header {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	user-select: none;
	transition: background-color 0.25s ease, color 0.25s ease;
	position: relative;
	outline: none;
}

.paw-accordion-header:focus-visible {
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.4);
}

.paw-accordion-title {
	flex: 1;
	font-weight: 600;
}

/* Toggle Icon */
.paw-toggle-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 14px;
	transition: transform 0.3s ease;
}

.paw-icon-right {
	margin-left: auto;
}

/* Item Icon */
.paw-item-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 16px;
}

/* Badge */
.paw-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	white-space: nowrap;
	flex-shrink: 0;
}

/* Content */
.paw-accordion-content {
	overflow: hidden;
}

.paw-accordion-content-inner {
	line-height: 1.7;
}

/* Content overflow for fade animation */
.paw-accordion-content.paw-fade {
	opacity: 0;
	transition: opacity 0.3s ease;
}

.paw-accordion-content.paw-fade.paw-fade-in {
	opacity: 1;
}

/* Active state icon rotation */
.paw-accordion-item.paw-active .paw-toggle-icon {
	transform: rotate(45deg);
}

/* When using minus icon, don't rotate */
.paw-accordion-item.paw-active .paw-toggle-icon.paw-no-rotate {
	transform: none;
}

/* ─── Show More / Pagination ──────────────────────────────── */
.paw-show-more-wrapper {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}

.paw-show-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	border: none;
	font-family: inherit;
	transition: background-color 0.25s ease, color 0.25s ease, transform 0.15s ease, box-shadow 0.25s ease;
}

.paw-show-more-btn:hover {
	transform: translateY(-1px);
}

.paw-show-more-btn:active {
	transform: translateY(0);
}

.paw-btn-icon {
	font-size: 13px;
	transition: transform 0.3s ease;
}

.paw-show-more-btn.paw-showing-all .paw-btn-icon {
	transform: rotate(180deg);
}

.paw-items-counter {
	font-size: 13px;
	color: #888;
	white-space: nowrap;
}

/* ─── Loading animation for show-more items ─────────────── */
@keyframes paw-slide-down {
	from {
		opacity: 0;
		transform: translateY(-8px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.paw-accordion-item.paw-reveal-animation {
	animation: paw-slide-down 0.3s ease forwards;
}

/* ─── Responsive ──────────────────────────────────────────── */
@media (max-width: 767px) {
	.paw-accordion-header {
		gap: 8px;
	}
	.paw-badge {
		display: none;
	}
}