/*
Theme Name: InFocus Photo Club
Template: twentytwentyfive
Theme URI: https://in-focus.local
Author: InFocus Photo Club
Description: Brand styling for the InFocus Photo Club (Wausau, WI) website, built on Twenty Twenty-Five.
Version: 1.0.0
Text Domain: infocus
*/

/* The Events Calendar: re-theme via its official CSS custom properties
   instead of the default blue, so calendar views match the site brand. */
:root {
	--tec-color-accent-primary: #150E63 !important;
	--tec-color-accent-primary-hover: #150E63cc !important;
	--tec-color-accent-primary-active: #150E63e6 !important;
	--tec-color-accent-primary-background: #150E6312 !important;
	--tec-color-accent-primary-week-event: #150E631a !important;
	--tec-color-accent-primary-week-event-hover: #150E6333 !important;
	--tec-color-accent-primary-week-event-featured: #150E630a !important;
	--tec-color-accent-primary-week-event-featured-hover: #150E6324 !important;
	--tec-color-accent-secondary: #D6AC4A !important;
	--tec-color-accent-secondary-hover: #D6AC4Acc !important;
	--tec-color-accent-secondary-active: #D6AC4Ae6 !important;
	--tec-color-accent-secondary-background: #D6AC4A12 !important;
	--tec-color-icon-focus: #150E63 !important;
	--tec-color-border-active: #150E63 !important;
	--tec-border-radius-default: 6px !important;
}

/* Give the list view a bit more visual character: a branded date badge,
   an eyebrow-style month label, and a soft hover card per event row. */
.tribe-events-calendar-list__month-separator-text {
	color: var(--wp--preset--color--accent-2) !important;
	font-weight: 700 !important;
	letter-spacing: 1.5px !important;
	text-transform: uppercase !important;
}

.tribe-events-calendar-list__event-date-tag {
	background-color: var(--wp--preset--color--accent-1);
	border-radius: 8px;
	padding: 14px 6px;
	text-align: center;
}

.tribe-events-calendar-list__event-date-tag-weekday {
	color: rgba(255, 255, 255, 0.75) !important;
	font-weight: 600 !important;
	letter-spacing: 1px !important;
}

.tribe-events-calendar-list__event-date-tag-daynum {
	color: #ffffff !important;
}

.tribe-events-calendar-list__event-row {
	padding: 16px;
	margin: 0 -16px;
	border-radius: 8px;
	transition: background-color 0.2s ease;
}

.tribe-events-calendar-list__event-row:hover {
	background-color: var(--wp--preset--color--accent-5);
}

.tribe-events-calendar-list__event-title-link {
	color: var(--wp--preset--color--accent-1) !important;
}

.tribe-events-calendar-list__event-title-link:hover {
	color: var(--wp--preset--color--accent-2) !important;
}

/* Month view: turn each event into a small branded pill instead of plain text */
.tribe-events-calendar-month__calendar-event-details {
	background-color: var(--wp--preset--color--accent-3);
	border-left: 3px solid var(--wp--preset--color--accent-1);
	border-radius: 4px;
	padding: 4px 8px !important;
}

.tribe-events-calendar-month__calendar-event-title-link {
	color: var(--wp--preset--color--accent-1) !important;
	font-weight: 600 !important;
}

/* Flexible grid for category cards: sizes naturally with 1 item, wraps cleanly as more are added */
.infocus-category-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--wp--preset--spacing--30, 20px);
	align-items: stretch;
}

.infocus-category-grid > div {
	flex: 0 1 320px;
}

/* Gallery hub: featured category cards (image + content, hover lift).
   Built from real Group/Image/Heading/Paragraph blocks (not raw HTML) so
   anyone can duplicate a card in the block editor and edit it visually. */
.infocus-category-card {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--accent-3);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(21, 14, 99, 0.06);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	height: 100%;
}

.infocus-category-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(21, 14, 99, 0.14);
}

.infocus-category-card-image {
	margin: 0;
}

.infocus-category-card-image img {
	height: 220px;
	width: 100%;
	object-fit: cover;
	display: block;
}

.infocus-category-card-placeholder {
	height: 220px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--wp--preset--color--accent-3);
}

.infocus-category-card-body {
	padding: 1.75rem;
}

.infocus-category-card-eyebrow {
	display: block;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-2);
	margin: 0 0 0.5rem;
}

.infocus-category-card-title {
	font-weight: 600;
	margin: 0 0 0.5rem;
}

.infocus-category-card-title a {
	text-decoration: none;
}

.infocus-category-card-desc {
	color: var(--wp--preset--color--contrast);
	margin: 0 0 1rem;
}

.infocus-category-card-cta {
	font-weight: 600;
	margin: 0;
}

.infocus-category-card-cta a {
	text-decoration: none;
}

.infocus-category-card:hover .infocus-category-card-cta {
	color: var(--wp--preset--color--accent-2);
}
