/*
Theme Name: LabDiamond
Theme URI: https://labdiamond.md
Author: LabDiamond
Author URI: https://labdiamond.md
Description: Temă FSE premium pentru magazinul de diamante create în laborator LabDiamond. Design tokens în theme.json, fonturi auto-găzduite, WooCommerce.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.1
Requires Plugins: woocommerce
Version: 1.0.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: labdiamond
Tags: full-site-editing, block-styles, e-commerce, custom-colors, custom-menu, threaded-comments
*/

/*
 * Design tokens live in theme.json (colors, fonts, sizes, spacing).
 * Only complement them here — never redeclare token values.
 * All values below reference the --wp--* custom properties WP generates.
 */

html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
	text-rendering: optimizeLegibility;
	/* Clip WooCommerce's off-canvas mini-cart drawer (parked off-screen) so it
	   never creates a horizontal scrollbar. `clip` (not hidden) keeps the
	   desktop sticky filter sidebar working. */
	overflow-x: clip;
}

/* Accessible focus ring in the brand accent (theme.json cannot fully express :focus-visible globally). */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* Smooth interactive transitions using the custom transition tokens. */
:where(a, .wp-element-button, .wp-block-button__link) {
	transition: color var(--wp--custom--transition--base),
		background-color var(--wp--custom--transition--base),
		border-color var(--wp--custom--transition--base);
}

/* Respect reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	:where(a, .wp-element-button, .wp-block-button__link) { transition: none; }
}

/* ----------------------------------------------------------------------- *
 *  Header (global) — refined navigation with an animated gold underline so
 *  the menu reads as designed navigation, not plain text.
 * ----------------------------------------------------------------------- */
.ldd-header { border-bottom: 1px solid var(--wp--preset--color--platinum); }

.ldd-header__nav { font-size: 0.75rem; }
/* Keep the six items on one line on desktop (override the block's larger gap). */
.ldd-header__nav .wp-block-navigation__container { gap: 0.6rem 1.1rem; }
/* Constrain the search field so the nav has room. */
.ldd-header__search { max-width: 210px; }

.ldd-header__nav .wp-block-navigation-item__content {
	position: relative;
	display: inline-block;
	padding: 5px 0;
	font-weight: 500;
	letter-spacing: 0.015em;
	color: var(--wp--preset--color--contrast);
	transition: color 0.3s ease;
}
.ldd-header__nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1.5px;
	background: var(--wp--preset--color--accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.4s cubic-bezier(0.16, 0.84, 0.32, 1);
}
.ldd-header__nav .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.ldd-header__nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}
.ldd-header__nav .wp-block-navigation-item:hover > .wp-block-navigation-item__content::after,
.ldd-header__nav .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content::after,
.ldd-header__nav .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
}
@media (prefers-reduced-motion: reduce) {
	.ldd-header__nav .wp-block-navigation-item__content::after { transition: none; }
}

/* Mobile hamburger + overlay menu. */
.ldd-header__nav .wp-block-navigation__responsive-container-open,
.ldd-header__nav .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--contrast);
}
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--base);
	padding: var(--wp--preset--spacing--60, 2rem);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.2rem;
	padding: 0.45rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after {
	display: none;
}

/* Header layout breathing room on small screens. */
@media (max-width: 600px) {
	.ldd-header { padding-left: var(--wp--preset--spacing--40, 1rem); padding-right: var(--wp--preset--spacing--40, 1rem); }
	.ldd-header__search { display: none; }
}