/*
Theme Name: Retrato
Theme URI: https://themeshaper.com/retrato 
Author: Automattic
Author URI: https://automattic.com
Description: Besides an appreciable snapshot of the author, the theme immediately offers large titles and post meta data displayed on a grid with no Featured Images.
Requires at least: 
Tested up to: 6.5
Requires PHP: 
Version: 1.0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: retrato
Tags: blog, news, grid-layout, three-columns, right-sidebar, block-patterns, block-styles, custom-colors, custom-header, custom-logo, custom-menu, editor-style, full-site-editing, post-formats, rtl-language-support, sticky-post, style-variations, template-editing, theme-options, threaded-comments, translation-ready

/*
 * Control the hover stylings of outline block style.
 * Unnecessary once block styles are configurable via theme.json
 * https://github.com/WordPress/gutenberg/issues/42794
 */

/*
 * Control the hover stylings of outline block style.
 * Unnecessary once block styles are configurable via theme.json
 * https://github.com/WordPress/gutenberg/issues/42794
 */
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background):hover {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--secondary);
}

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: .0625em !important;
	text-underline-offset: .15em;
}

/*
 * Page Description Styles
 */
.page-description {
	font-family: var(--wp--preset--font-family--urbanist);
	font-size: 1.25rem;
	line-height: 1.6;
	margin: 1.5rem 0 2rem 0;
	opacity: 0.9;
	max-width: 800px;
}

/* Responsive styles for page description */
@media (max-width: 768px) {
	.page-description {
		font-size: 1.1rem;
		margin: 1rem 0 1.5rem 0;
	}
}

/* Featured Image in Main Text Column */
.single .content-featured-image {
	margin-bottom: 2rem !important;
	text-align: left; /* Align with text */
	width: 100% !important;
}

.single .content-featured-image img {
	max-width: 100% !important; /* Full width of the column */
	max-height: 25rem !important; /* Maximum height constraint */
	height: auto !important;
	width: auto !important;
	object-fit: contain !important;
	display: block !important;
	margin: 0 !important;
}

/* Responsive adjustments for featured image */
@media (max-width: 768px) {
	.single .content-featured-image {
		padding: 0 0.5rem !important; /* Small padding on mobile */
	}
}

@media (min-width: 769px) {
	.single .content-featured-image {
		padding: 0 1rem !important; /* Moderate padding on larger screens */
	}
}

/* Hero Section Responsive Sizing */

/* Reduce hero section padding on mobile for better proportions */
@media (max-width: 768px) {
	.single .wp-block-group.alignfull.has-contrast-background-color {
		padding-top: 1.5rem !important;
		padding-right: 1rem !important;
		padding-left: 1rem !important;
	}

	.single .wp-block-group.alignwide {
		padding-bottom: 2rem !important; /* Reduce bottom padding on mobile */
	}
}

/* Adjust hero section for medium screens */
@media (min-width: 769px) and (max-width: 1024px) {
	.single .wp-block-group.alignfull.has-contrast-background-color {
		padding-top: 1.5rem !important;
		padding-bottom: 0rem !important;
	}

	.single .wp-block-group.alignwide {
		padding-bottom: 3rem !important; /* Moderate padding on tablet */
	}
}

/* Desktop hero section */
@media (min-width: 1025px) {
	.single .wp-block-group.alignfull.has-contrast-background-color {
		padding-top: 2rem !important;
		padding-bottom: 0rem !important;
	}

	.single .wp-block-group.alignwide {
		padding-bottom: 4rem !important; /* Full padding on desktop */
	}
}