/* Template CSS - archive */
/* Loaded on template: archive */
/* Build date: 2025-10-28 16:56:52 */
/* DO NOT EDIT - Generated file */

   SECTION 3: ARCHIVE STYLES
   ======================================== */

/* ADHD Stories Archive (archive-adhd_stories.php) */
.archive-stories {
	padding: 40px 0;
}

.archive-header {
	text-align: center;
	margin-bottom: 40px;
	padding-bottom: 30px;
	border-bottom: 2px solid var(--ads-border-color);
}

.archive-title {
	color: var(--ads-primary);
	font-size: 2.5rem;
	margin-bottom: 15px;
}

.archive-description {
	font-size: 1.25rem;
	color: var(--ads-text-light);
	max-width: 700px;
	margin: 0 auto;
}

.filter-section {
	background: var(--ads-neutral);
	padding: 20px;
	border-radius: var(--ads-border-radius);
	margin-bottom: 40px;
}

.filter-group {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-bottom: 15px;
	flex-wrap: wrap;
}

.filter-group:last-child {
	margin-bottom: 0;
}

.filter-group label {
	font-weight: 600;
	min-width: 120px;
}

.filter-btn {
	padding: 6px 15px;
	background: white;
	border: 1px solid var(--ads-border-color);
	border-radius: 20px;
	color: var(--ads-text);
	text-decoration: none;
	transition: all 0.3s ease;
	font-size: 0.9rem;
}

.filter-btn:hover {
	background: var(--ads-primary);
	color: white;
	border-color: var(--ads-primary);
}

.stories-grid {
	margin-bottom: 40px;
}

.story-card {
	margin-bottom: 30px;
	padding: 30px;
}

.story-thumbnail {
	border-radius: var(--ads-border-radius);
	overflow: hidden;
	height: 100%;
}

.story-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
	min-height: 250px;
}

.story-card:hover .story-thumbnail img {
	transform: scale(1.05);
}

.story-content {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.story-header {
	margin-bottom: 20px;
}

.story-title {
	font-size: 1.75rem;
	margin-bottom: 10px;
	line-height: 1.3;
}

.story-title a {
	color: var(--ads-text);
	text-decoration: none;
	transition: color 0.3s ease;
}

.story-title a:hover {
	color: var(--ads-primary);
}

.story-meta {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	font-size: 0.9rem;
	color: var(--ads-text-light);
}

.story-meta span {
	display: flex;
	align-items: center;
	gap: 5px;
}

.story-meta .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.story-excerpt {
	flex: 1;
	margin-bottom: 20px;
	line-height: 1.6;
	color: var(--ads-text-light);
}

.story-tags {
	margin-bottom: 20px;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.tag {
	padding: 4px 12px;
	border-radius: 15px;
	font-size: 0.85rem;
	font-weight: 500;
}

.age-tag {
	background: var(--ads-neutral);
	color: var(--ads-primary);
}

.type-tag {
	background: var(--ads-accent);
	color: white;
}

.story-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 20px;
	border-top: 1px solid var(--ads-border-color);
}

.story-stats {
	display: flex;
	gap: 15px;
}

.stat-item {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--ads-text-light);
	font-size: 0.9rem;
}

.stat-item .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.story-cta {
	text-align: center;
	padding: 40px;
	background: linear-gradient(135deg, var(--ads-primary), var(--ads-secondary));
	color: white;
}

.story-cta h3 {
	color: white;
	font-size: 2rem;
	margin-bottom: 15px;
}

.story-cta p {
	font-size: 1.1rem;
	margin-bottom: 25px;
	opacity: 0.95;
}

.story-cta .ads-btn {
	background: white;
	color: var(--ads-primary);
	border-color: white;
}

.story-cta .ads-btn:hover {
	background: var(--ads-neutral);
	border-color: var(--ads-neutral);
}

.no-results {
	text-align: center;
	padding: 60px 20px;
}

.pagination {
	text-align: center;
	margin-top: 40px;
}

@media (max-width: 768px) {
	.filter-group {
		flex-direction: column;
		align-items: flex-start;
	}
	
	.filter-group label {
		min-width: auto;
	}
	
	.story-footer {
		flex-direction: column;
		gap: 15px;
	}
	
	.story-meta {
		flex-direction: column;
		gap: 10px;
	}
}

/* ADHD Tips Archive (archive-adhd_tips.php) */
.archive-tips {
	padding: 40px 0;
}

.tips-grid {
	margin-bottom: 40px;
}

.tip-card {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.tip-thumbnail {
	margin: -20px -20px 20px -20px;
	border-radius: var(--ads-border-radius) var(--ads-border-radius) 0 0;
	overflow: hidden;
}

.tip-thumbnail img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.tip-card:hover .tip-thumbnail img {
	transform: scale(1.05);
}

.tip-content {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.tip-title {
	font-size: 1.25rem;
	margin-bottom: 10px;
}

.tip-title a {
	color: var(--ads-text);
	text-decoration: none;
	transition: color 0.3s ease;
}

.tip-title a:hover {
	color: var(--ads-primary);
}

.tip-meta {
	margin-bottom: 15px;
	font-size: 0.9rem;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.meta-type a,
.meta-difficulty a {
	color: var(--ads-primary);
	text-decoration: none;
	padding: 2px 8px;
	background: var(--ads-neutral);
	border-radius: 12px;
	margin-right: 5px;
}

.meta-difficulty a {
	background: var(--ads-accent);
	color: white;
}

.tip-excerpt {
	flex: 1;
	margin-bottom: 20px;
	color: var(--ads-text-light);
}

.tip-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.read-time {
	color: var(--ads-text-light);
	font-size: 0.9rem;
	display: flex;
	align-items: center;
	gap: 5px;
}

.read-time .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

@media (max-width: 768px) {
	.tip-footer {
		flex-direction: column;
		gap: 10px;
	}
}

/* ADHD Resources Archive (archive-adhd_resources.php) */
.archive-resources {
	padding: 40px 0;
}

.resources-grid {
	margin-bottom: 40px;
}

.resource-card {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.resource-thumbnail {
	margin: -20px -20px 20px -20px;
	border-radius: var(--ads-border-radius) var(--ads-border-radius) 0 0;
	overflow: hidden;
}

.resource-thumbnail img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.resource-card:hover .resource-thumbnail img {
	transform: scale(1.05);
}

.resource-content {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.resource-title {
	font-size: 1.25rem;
	margin-bottom: 10px;
}

.resource-title a {
	color: var(--ads-text);
	text-decoration: none;
	transition: color 0.3s ease;
}

.resource-title a:hover {
	color: var(--ads-primary);
}

.resource-meta {
	margin-bottom: 15px;
	font-size: 0.9rem;
}

.meta-age a {
	color: var(--ads-primary);
	text-decoration: none;
	padding: 2px 8px;
	background: var(--ads-neutral);
	border-radius: 12px;
	margin-right: 5px;
}

.resource-excerpt {
	flex: 1;
	margin-bottom: 20px;
	color: var(--ads-text-light);
}