/*
Theme Name: Pěvecký sbor Šternberk
Theme URI: https://peveckysborsternberk.cz
Author: pohodovywp.cz
Description: Block theme pro web Pěveckého sboru Šternberk. Plná podpora Site Editoru a Gutenbergu.
Version: 1.0.3
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pss-theme
*/

/* ==========================================================
   CUSTOM STYLES (beyond theme.json capabilities)
   Viewport range: 36rem (576px) – 128rem (2048px)
   ========================================================== */

/* --- Radius in images --- */
.wp-block-image img {
  border-radius: var(--wp--custom--border-radius--m);
}

/* --- Smart Spacing (auto margins in flow content) --- */
.entry-content > * + *,
.wp-block-group > * + * {
	margin-block-start: var(--wp--preset--spacing--m);
}

.entry-content > * + h1,
.entry-content > * + h2,
.entry-content > * + h3,
.entry-content > * + h4,
.entry-content > * + h5,
.entry-content > * + h6,
.wp-block-group > * + h1,
.wp-block-group > * + h2,
.wp-block-group > * + h3,
.wp-block-group > * + h4,
.wp-block-group > * + h5,
.wp-block-group > * + h6 {
	margin-block-start: var(--wp--preset--spacing--l);
}

.entry-content {
	margin-top: 0;
	margin-block-start: 0;
}

/* --- Fixed Header --- */
.site-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	background-color: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	transition: var(--wp--custom--transition);
}

.site-header .wp-block-group {
	height: var(--wp--custom--header-height);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.site-header .wp-block-site-logo img {
	height: 60px;
	width: auto;
}

/* Body base */
body {
	padding-top: 0;
}

/* --- Navigation Links --- */
.site-header .wp-block-navigation a {
	position: relative;
}

.site-header .wp-block-navigation a::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 0;
	width: 0;
	height: 2px;
	background-color: var(--wp--preset--color--primary);
	transition: var(--wp--custom--transition);
}

.site-header .wp-block-navigation a:hover::after,
.site-header .wp-block-navigation a[aria-current="page"]::after {
	width: 100%;
}

/* --- Accent Separator (golden underline under headings) --- */
.wp-block-separator.is-style-accent-line {
	border-top: 3px solid var(--wp--preset--color--accent);
	width: 60px;
	margin-left: auto;
	margin-right: auto;
}

/* --- Cover Block (Hero) enhancements --- */
.wp-block-cover.hero-cover {
	min-height: 100vh !important;
	padding-top: var(--wp--custom--header-height);
}

.wp-block-cover.hero-cover h1 {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 600;
	letter-spacing: 2px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
	color: #fff;
}

.wp-block-cover.hero-cover p {
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 300;
	font-style: italic;
	color: #fff;
}

/* --- Page Header (subpages) --- */
.page-header-cover {
	padding-top: calc(var(--wp--custom--header-height) + 70px) !important;
	padding-bottom: var(--wp--preset--spacing--section-m) !important;
	min-height: auto !important;
}

.page-header-cover h1 {
	font-size: var(--wp--preset--font-size--h-1);
	color: #fff;
}

/* --- Event Card (Query Loop template) --- */
.event-card {
	background: var(--wp--preset--color--bg-white);
	border-radius: var(--wp--custom--border-radius--m);
	overflow: hidden;
	box-shadow: var(--wp--custom--shadow);
	transition: var(--wp--custom--transition);
}

.event-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--wp--custom--shadow-hover);
}

.event-card .wp-block-post-featured-image {
	height: 200px;
	overflow: hidden;
	position: relative;
}

.event-card .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Event status pill badge */
.event-status-pill {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 4px 14px;
	border-radius: var(--wp--custom--border-radius--full);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	z-index: 2;
}

.event-status-pill--upcoming {
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--secondary);
}

.event-status-pill--past {
	background-color: rgba(255, 255, 255, 0.85);
	color: var(--wp--preset--color--text-muted);
}

.event-card-details {
	padding: 25px;
}

.event-card-details h3 {
	font-size: var(--wp--preset--font-size--large);
	margin-bottom: 10px;
	color: var(--wp--preset--color--secondary);
}

.event-card-details .event-date-text {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase;
	margin-bottom: 8px;
}

/* --- CTA Box --- */
.cta-box {
	background: var(--wp--preset--color--bg-white);
	padding: var(--wp--preset--spacing--xl);
	border-radius: var(--wp--custom--border-radius--m);
	box-shadow: var(--wp--custom--shadow);
	transition: var(--wp--custom--transition);
	text-align: center;
}

.cta-box:hover {
	box-shadow: var(--wp--custom--shadow-hover);
}

.cta-box h3 {
	color: var(--wp--preset--color--primary);
}

/* --- Video Wrapper (responsive 16:9) --- */
.video-responsive {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	border-radius: var(--wp--custom--border-radius--m);
	overflow: hidden;
	box-shadow: var(--wp--custom--shadow);
}

.video-responsive iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* --- Choir Master Card (Pattern) --- */
.master-card {
	background: var(--wp--preset--color--bg-white);
	padding: var(--wp--preset--spacing--xl);
	border-radius: var(--wp--custom--border-radius--m);
	box-shadow: var(--wp--custom--shadow);
	text-align: center;
}

.master-card img {
	width: 150px;
	height: 150px;
	border-radius: 50%;
	object-fit: cover;
	object-position: top;
	border: 4px solid var(--wp--preset--color--primary-light);
	margin: 0 auto var(--wp--preset--spacing--m);
	display: block;
}

.master-card h3 {
	color: var(--wp--preset--color--primary);
}

/* --- Contact Info Card --- */
.contact-info-card {
	background: var(--wp--preset--color--bg-white);
	padding: var(--wp--preset--spacing--xl);
	border-radius: var(--wp--custom--border-radius--m);
	box-shadow: var(--wp--custom--shadow);
}

.contact-info-card h3 {
	color: var(--wp--preset--color--primary);
	border-bottom: 1px solid #eee;
	padding-bottom: 15px;
}

.info-label {
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--text-muted);
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 600;
	margin-bottom: 5px;
}

.info-value {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
	color: var(--wp--preset--color--secondary);
}

/* --- Social Links --- */
.social-links-row a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-color: rgba(255, 255, 255, 0.1);
	border-radius: 50%;
	color: #fff;
	transition: var(--wp--custom--transition);
}

.social-links-row a:hover {
	background-color: var(--wp--preset--color--primary);
	transform: translateY(-3px);
}

/* --- Social Box (Videogalerie) --- */
.social-box {
	background: var(--wp--preset--color--bg-white);
	padding: var(--wp--preset--spacing--xl);
	border-radius: var(--wp--custom--border-radius--m);
	box-shadow: var(--wp--custom--shadow);
	text-align: center;
	max-width: 600px;
	margin: var(--wp--preset--spacing--section-s) auto 0;
}

.social-box h3 {
	color: var(--wp--preset--color--primary);
}

.social-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 30px;
	border-radius: var(--wp--custom--border-radius--l);
	color: #fff;
	font-weight: 600;
	transition: var(--wp--custom--transition);
}

.social-btn--fb {
	background-color: #1877F2;
}

.social-btn--fb:hover {
	background-color: #166fe5;
	color: #fff;
}

.social-btn--ig {
	background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888);
}

.social-btn--ig:hover {
	filter: brightness(1.1);
	color: #fff;
}

/* --- Footer --- */
.site-footer {
	background-color: var(--wp--preset--color--footer-bg);
	color: var(--wp--preset--color--footer-text);
}

.site-footer h4 {
	color: #fff;
	font-family: var(--wp--preset--font-family--sans);
	text-transform: uppercase;
	letter-spacing: 1px;
}

.site-footer a {
	color: var(--wp--preset--color--footer-text);
}

.site-footer a:hover {
	color: var(--wp--preset--color--accent);
}

.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding-top: var(--wp--preset--spacing--m);
	text-align: center;
	font-size: var(--wp--preset--font-size--xs);
}

/* --- Button outline variant --- */
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
	background: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--primary);
	color: #fff;
}

/* White outline for dark sections */
.wp-block-button.is-style-outline-white .wp-block-button__link {
	border: 2px solid #fff;
	color: #fff;
	background: transparent;
}

.wp-block-button.is-style-outline-white .wp-block-button__link:hover {
	background: #fff;
	color: var(--wp--preset--color--primary);
}

/* --- Gallery (Akce page) --- */
.wp-block-gallery.akce-gallery .wp-block-image img {
	height: 200px;
	object-fit: cover;
	border-radius: var(--wp--custom--border-radius--m);
}

/* --- Responsive --- */
@media (max-width: 768px) {
	.about-grid {
		flex-direction: column;
	}

	.about-image-wrapper::before {
		display: none;
	}

	body {
		padding-top: 0;
	}

	.site-header .wp-block-group {
		height: 70px;
	}

	.site-header .wp-block-site-logo img {
		height: 45px;
	}
}