/*
Theme Name: atelier-anita
Theme URI:
Author: Sergio Menegassi
Author URI:
Description: a new block theme created with Claude
Requires at least: 7.0
Tested up to: 7.0
Requires PHP: 5.7
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: atelier-anita
Tags:
*/

/* Image hover effect: homepage thumbnails reveal a "Text Over Image" caption + dark overlay on hover */
.anime-image-mise-en-avant {
	display: block;
	overflow: hidden;
}

.post-thumb-hover {
	overflow: hidden;
	position: relative;
}

.post-thumb-hover::after {
	background-color: rgb(0 0 0 / 35%);
	content: "";
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 0.4s ease;
	z-index: 1;
}

.post-thumb-hover:hover::after {
	opacity: 1;
}

.text-over-image {
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 1rem;
	pointer-events: none;
	position: absolute;
	right: 0;
	text-align: left;
	transform: translateY(100%);
	transition: transform 0.4s ease;
	z-index: 2;
}

.post-thumb-hover:hover .text-over-image {
	transform: translateY(0);
}

.overimage a:hover {
	background-image: linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 0, 0) 40%, rgba(255, 255, 255, 0));
}

/* Site shell: sticky left sidebar (25%) + main content (75%) */
.site-shell {
	align-items: flex-start;
	display: flex;
	gap: 0;
	margin: 0 auto;
	max-width: 80vw;
}

.site-shell > header {
	flex: 0 0 25%;
	max-width: 25%;
	padding: var(--wp--preset--spacing--30);
	position: sticky;
	top: 0;
}

.site-shell > main {
	flex: 1 1 75%;
	max-width: 75%;
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30) 0;
}
/* Compound + type selector needed to out-specificity two competing CoBlocks !important rules:
   [class*=wp-block].mt-0/.mb-0 (0,2,0) on posts with the block's "no margin" toggle on, and
   .wp-block-group div[class*="wp-block-coblocks-gallery"] (0,2,1) for galleries nested in a Group
   block. div/figure covers both the old (div) and current (figure) gallery-masonry markup. */
div.wp-block-coblocks-gallery-masonry.m-masonry,
figure.wp-block-coblocks-gallery-masonry.m-masonry {
	margin-bottom: 2rem !important;
	margin-top: 2rem !important;
}

/* Sidebar nav styling */
:root {
	--nav-active-bg: #333333; /* Dark Grey */
}

.site-sidebar-inner {
	gap: var(--wp--preset--spacing--30) !important;
}

.site-sidebar-inner .wp-block-navigation {
	gap: 20px !important;
}

.site-sidebar-inner .wp-block-navigation-item {
	list-style: none;
}

.site-sidebar-inner .wp-block-navigation a {
	text-decoration: none;
}

.site-sidebar-inner .wp-block-navigation a:hover {
	text-decoration: underline;
}

/* Active nav item: WP marks the current page's nav link with .current-menu-item,
   so this stays in sync automatically as visitors navigate between pages. */
.site-sidebar-inner .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content {
	background-color: var(--nav-active-bg);
	border-radius: 4px;
	color: #fff;
	padding: 4px 10px;
}

.site-sidebar-inner .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content:hover {
	text-decoration: none;
}

/* Separator: force a thin 1px line (core/separator has no border support) */
.wp-block-separator.has-background:not(.is-style-wide):not(.is-style-dots) {
	height: 1px;
}

/* Sidebar nav item dividers: a border on specific items stands in for a
   separator block, since the single nav menu can't otherwise be split
   without turning into multiple mobile menu toggles. */
.site-sidebar-inner .wp-block-navigation-item.nav-divider {
	border-bottom: 1px solid #dfdfdf;
	padding-bottom: 12px;
}

/* Below 960px: stack sidebar above content instead of side-by-side */
@media (max-width: 959px) {
	.site-shell {
		display: block;
	}

	.site-shell > header {
		max-width: 100%;
		position: static;
	}

	.site-shell > main {
		max-width: 100%;
	}
}