/*
Theme Name: Bednár 2025
Theme URI: https://juraj.bednar.io/
Author: Juraj Bednár
Description: Child theme of Twenty Twenty-Five for juraj.bednar.io and hackyourself.io.
             Carries the palette, the Literata display face, and the two-language
             navigation. Everything that can live in a file lives here rather than
             in the database, so the redesign deploys by rsync.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.1
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: bednar-2025
*/

/* ---------------------------------------------------------------------------
   WooCommerce product loops.
   The block theme's heading styles land on product titles, which are <h2>s and
   end up as large violet display type. Product cards want quiet, readable
   labels — the price and the image do the selling.
   --------------------------------------------------------------------------- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--wp--preset--font-family--manrope);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--wp--preset--color--contrast);
	padding: 0.6rem 0 0.2rem;
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title {
	color: var(--wp--preset--color--accent-1);
}

.woocommerce ul.products li.product .price {
	font-family: var(--wp--preset--font-family--manrope);
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--wp--preset--color--accent-4);
}

.woocommerce ul.products li.product img {
	border-radius: 4px;
}

/* Give the loop room to breathe when it sits inside a wide group. */
.woocommerce ul.products {
	gap: var(--wp--preset--spacing--30);
}

/* ---------------------------------------------------------------------------
   Navigation: the submenu indicator inherits the link colour, and the top-level
   items need a little more tracking than TT5's default at this size.
   --------------------------------------------------------------------------- */
.wp-block-navigation .wp-block-navigation-item__content {
	letter-spacing: -0.005em;
}

.wp-block-navigation .wp-block-navigation__submenu-container {
	border-color: var(--wp--preset--color--accent-6);
	box-shadow: 0 12px 32px -20px rgba(36, 31, 51, 0.55);
}

/* ---------------------------------------------------------------------------
   Latest Posts.

   Two problems with the core block here:

   1. Featured images arrive at whatever aspect ratio the author uploaded, so a
      column of them steps in and out and leaves ragged gaps. Pin them all to
      one ratio and crop.

   2. The homepage block sets postLayout "grid" but core only lays it out when a
      columns-N class is present. Without one, its own rule gives every item
      width:100%, so a "grid" renders as a single stack of full-width photos.
      Re-lay it as a real CSS grid. The !important is needed because core's
      selector (.wp-block-latest-posts.is-grid:not(.is-layout-grid) li) is one
      class more specific than anything we can write against the same element.
   --------------------------------------------------------------------------- */
.wp-block-latest-posts__featured-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 4px;
	display: block;
}

.wp-block-latest-posts__featured-image {
	margin-bottom: 0.7rem;
}

.wp-block-latest-posts.is-grid {
	/* !important throughout: core's own rule is
	   `.wp-block-latest-posts.is-grid:not(.is-layout-grid){display:flex}`,
	   one class more specific than anything addressable on this element. */
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--wp--preset--spacing--50);
	align-items: start;
}

.wp-block-latest-posts.is-grid li {
	width: auto !important;
	margin: 0 !important;
}

.wp-block-latest-posts__post-title {
	font-family: var(--wp--preset--font-family--literata);
	font-size: 1.05rem;
	font-weight: 600;
	line-height: 1.28;
	display: inline-block;
}

.wp-block-latest-posts__post-excerpt,
.wp-block-latest-posts__post-full-content {
	margin-top: 0.4rem;
	font-size: 0.92rem;
	line-height: 1.5;
	color: var(--wp--preset--color--accent-4);
}

/* The footer list has no images and should stay compact. */
.wp-block-group .wp-block-latest-posts__list:not(.is-grid) li {
	margin-bottom: 0.55rem;
}