/*
Theme Name: PPP
Description: Child theme of Twenty Twenty-Five for paulpapadopoulos.com. Recreates the Parallax Pro look.
Template: twentytwentyfive
Version: 0.1.10
Requires at least: 6.7
Requires PHP: 8.1
Author: Paul Papadopoulos
Text Domain: ppp
*/

/* ---------- Header ---------- */
/* Sticky: the <header> template-part wrapper must be the sticky element */
header.wp-block-template-part:has(.ppp-header) {
	position: sticky;
	top: 0;
	z-index: 100;
}
.admin-bar header.wp-block-template-part:has(.ppp-header) { top: 32px; }
@media (max-width: 782px) { .admin-bar header.wp-block-template-part:has(.ppp-header) { top: 46px; } }

.ppp-header .wp-block-site-logo img { display: block; height: 70px; width: auto; }
/* Menu sits on the right, next to the cart (as on the current site) */
.ppp-header .wp-block-navigation { margin-left: auto; }

.ppp-header .wp-block-navigation .wp-block-navigation-item__content {
	padding: 27px 10px;
}
.ppp-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.ppp-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}
.ppp-header .wp-block-navigation a,
.ppp-header .wp-block-navigation a:hover,
.ppp-header .wp-block-navigation a:focus { text-decoration: none; }
/* No dropdown arrows on desktop (Parallax Pro had none) */
@media (min-width: 600px) {
	.ppp-header .wp-block-navigation__submenu-icon { display: none; }
}
/* Dropdowns: grey, semi-transparent, 180px, like Parallax Pro */
.ppp-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background-color: rgba(51, 51, 51, 0.85) !important;
	border: 0 !important;
	min-width: 180px !important;
	width: 180px;
}
.ppp-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border: 0 !important;
	background: transparent !important;
}
.ppp-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 20px !important;
	font-weight: 400;
	text-transform: none;
	line-height: 1.3;
}
/* Mobile overlay menu */
.ppp-header .wp-block-navigation__responsive-container.is-menu-open {
	background-color: #000 !important;
	color: #fff !important;
}
.ppp-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	background-color: transparent !important;
	width: auto;
}
.ppp-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	padding: 10px 0;
}

/* ---------- Page title rule (short grey line under H1) ---------- */
.ppp-title-rule.wp-block-separator {
	width: 40px;
	max-width: 40px;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--grey);
	margin: 20px auto 40px;
	opacity: 1;
}

/* ---------- Homepage sections (values measured on the live Parallax Pro site) ---------- */
.ppp-hero.wp-block-cover { min-height: calc(100vh - 70px) !important; padding: 100px 20px !important; }
.ppp-hero h1 { font-size: 72px !important; line-height: 1.2; margin: 0 auto 40px !important; }
.ppp-section h2,
.ppp-band h2 { font-size: 60px !important; line-height: 1.2; margin: 0 auto 40px !important; }
.ppp-hero p, .ppp-section p, .ppp-band p { font-size: 26px; line-height: 1.5; margin: 0 auto; }
/* padding, not margin: margins would collapse into the heading's 40px */
.ppp-hero .wp-block-buttons,
.ppp-section .wp-block-buttons,
.ppp-band .wp-block-buttons {
	margin-top: 0 !important;
	margin-block-start: 0 !important;
	padding-top: 20px;
	column-gap: 6px;
	row-gap: 20px;
}
.ppp-section.wp-block-group { padding: 140px 20px 150px !important; }
.ppp-band.wp-block-cover { min-height: 0 !important; padding: 190px 20px 200px !important; }
.ppp-band .wp-block-cover__inner-container,
.ppp-hero .wp-block-cover__inner-container { max-width: 1140px; }
@media (max-width: 480px) {
	.ppp-hero h1, .ppp-band h2, .ppp-section h2 { font-size: 36px !important; }
	.ppp-hero p, .ppp-section p, .ppp-band p { font-size: 22px; }
}
/* No white strip between the last homepage band and the footer */
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0 !important; }
/* iPhone/iPad Safari ignores fixed backgrounds; fall back to normal scrolling */
@supports (-webkit-touch-callout: none) {
	.wp-block-cover.has-parallax { background-attachment: scroll !important; }
}

/* Outline buttons */
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button .wp-block-button__link.is-style-outline {
	border-width: 2px;
	padding: 15px 25px !important;
}
.ppp-on-photo .wp-block-button__link {
	color: #fff !important;
	border-color: #fff !important;
	background: transparent !important;
}
.ppp-on-photo .wp-block-button__link:hover {
	background: #fff !important;
	color: #000 !important;
}

/* ---------- Galleries: tight gaps like the current tiles ---------- */
.wp-block-gallery.has-nested-images { gap: 4px; }
.wp-block-gallery.has-nested-images figure.wp-block-image { margin: 0; }

/* Images in content use the full column width, like the current site */
.wp-block-post-content .wp-block-image:not(.is-resized) img { width: 100%; height: auto; }

/* Captions */
.wp-element-caption, figcaption {
	font-size: var(--wp--preset--font-size--small);
	text-align: left;
	margin-top: 8px;
}

/* ---------- Footer ---------- */
.ppp-footer p { margin: 0; }

/* ---------- Mini Cart in header (WooCommerce) ---------- */
.ppp-header .wc-block-mini-cart__button { color: #fff; padding: 0 0 0 10px; }
.ppp-header .wc-block-mini-cart__badge { background: var(--wp--preset--color--accent); color: #fff; }

/* ---------- WooCommerce: same 740px column and buttons as the current site ---------- */
body.woocommerce main,
body.woocommerce-page main {
	--wp--style--global--content-size: 740px;
	--wp--style--global--wide-size: 740px;
}
.woocommerce-breadcrumb,
.wc-block-breadcrumbs,
.wp-block-woocommerce-breadcrumbs { display: none !important; }

/* Shop title centred with the short rule, like other pages */
body.woocommerce-shop h1.wp-block-query-title,
body.tax-product_cat h1.wp-block-query-title {
	text-align: center;
}
body.woocommerce-shop h1.wp-block-query-title::after,
body.tax-product_cat h1.wp-block-query-title::after {
	content: "";
	display: block;
	width: 40px;
	margin: 20px auto 20px;
	border-top: 1px solid var(--wp--preset--color--grey);
}

/* Product titles and prices in the grid: teal, left-aligned */
.wc-block-product-template .wp-block-post-title,
.wc-block-product-template .wp-block-post-title a {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 22px;
	color: var(--wp--preset--color--accent);
	text-align: left;
}
.wc-block-product-template .wc-block-components-product-price,
.wc-block-product-template .wp-block-woocommerce-product-price {
	color: var(--wp--preset--color--accent);
	text-align: left;
	font-size: 19px;
}
.wc-block-product-template .wp-block-woocommerce-product-button { text-align: left; justify-content: flex-start; }

/* Solid black shop buttons (Select options, Add to cart) */
.wc-block-components-product-button__button,
.single_add_to_cart_button,
.woocommerce .button,
.wp-block-woocommerce-product-button .wp-block-button__link {
	background: #000 !important;
	color: #fff !important;
	border: 0 !important;
	padding: 20px !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-radius: 0 !important;
}
.wc-block-components-product-button__button:hover,
.single_add_to_cart_button:hover,
.woocommerce .button:hover {
	background: var(--wp--preset--color--accent) !important;
}
/* Single product price in teal */
.single-product .wp-block-woocommerce-product-price,
.single-product .woocommerce-variation-price .price { color: var(--wp--preset--color--accent); }
