/*
Theme Name: LDX Community
Theme URI: https://ldx.community
Description: Twenty Twenty-Five child theme carrying the LDX Community design language — Recoleta + Nunito Sans, the purple/magenta palette, pill buttons and card styles from the LDX Figma file.
Author: Tangible
Author URI: https://teamtangible.com
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ldx-child
*/

/*
 * Tokens, element and block styles live in theme.json; section/button
 * variations live in styles/blocks/*.json. This file holds only what
 * theme.json can't express: rules that need asset URLs (icon masks, the
 * highlight shape) and a few structural selectors.
 */

/* Header
--------------------------------------------- */

.ldx-logo {
	margin: 0;
}

@media (max-width: 781px) {
	.ldx-logo img {
		width: 190px !important; /* --bb-header-mobile-logo-size on ldx.community */
	}
}

/* Search: icon-only button using the Figma search glyph. */
.wp-block-search__button-only .wp-block-search__button.has-icon {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	position: relative;
	padding: 0;
	min-width: 24px;
	min-height: 24px;
}

.wp-block-search__button-only .wp-block-search__button.has-icon:hover {
	background: transparent;
	color: var(--wp--preset--color--accent-3);
}

.wp-block-search__button-only .wp-block-search__button.has-icon svg {
	opacity: 0;
	width: 24px;
	height: 24px;
}

.wp-block-search__button-only .wp-block-search__button.has-icon::before {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 24px;
	height: 24px;
	translate: -50% -50%;
	background: currentColor;
	-webkit-mask: url(assets/icons/search.svg) center / contain no-repeat;
	mask: url(assets/icons/search.svg) center / contain no-repeat;
}

/* Footer
--------------------------------------------- */

.ldx-footer-nav .wp-block-navigation-item__content {
	color: var(--wp--preset--color--base);
}

.ldx-footer-nav .wp-block-navigation-item__content:hover,
.ldx-footer-nav .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--magenta-300);
}

/* Heading style: Highlight
 * Mark text with the editor's Highlight format; the mark gets the
 * hand-drawn pill from the Figma hero ("Answered.").
--------------------------------------------- */

.is-style-ldx-highlight mark {
	background: url(assets/images/highlight.svg) center / 100% 100% no-repeat;
	color: var(--wp--preset--color--purple-800);
	padding-inline: 0.12em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* List style: Checklist
--------------------------------------------- */

.wp-block-list.is-style-ldx-checklist {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
	gap: 24px 48px;
	list-style: none;
	padding-inline-start: 0;
}

.is-style-ldx-checklist > li {
	position: relative;
	margin: 0;
	padding-inline-start: 40px;
}

.is-style-ldx-checklist > li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: calc((1lh - 24px) / 2);
	width: 24px;
	height: 24px;
	background: currentColor;
	-webkit-mask: url(assets/icons/check.svg) center / contain no-repeat;
	mask: url(assets/icons/check.svg) center / contain no-repeat;
}

/* Post template style: Linked list
 * Divided rows with an icon, titles truncated to one line.
--------------------------------------------- */

.wp-block-post-template.is-style-ldx-linked-list > li {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 16px 24px;
	border-bottom: 1px solid var(--wp--preset--color--accent-2);
}

.wp-block-post-template.is-style-ldx-linked-list > li:last-child {
	border-bottom: 0;
}

.wp-block-post-template.is-style-ldx-linked-list > li::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	background: var(--wp--preset--color--accent-3);
	-webkit-mask: url(assets/icons/poll-h.svg) center / contain no-repeat;
	mask: url(assets/icons/poll-h.svg) center / contain no-repeat;
}

.is-style-ldx-linked-list .wp-block-post-title {
	flex: 1;
	min-width: 0;
	margin: 0;
	overflow: hidden;
	font-family: var(--wp--preset--font-family--nunito-sans);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	line-height: 1.5;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.is-style-ldx-linked-list .wp-block-post-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.is-style-ldx-linked-list .wp-block-post-title a:hover {
	color: var(--wp--preset--color--accent-3);
}

/* Edge-to-edge rows inside a card. */
[class*="is-style-ldx-card"] .is-style-ldx-linked-list {
	max-width: none; /* core caps post-template at 100%, which cancels the right-hand bleed */
	margin-inline: calc(-1 * var(--wp--custom--card--padding));
}

[class*="is-style-ldx-card"] > .wp-block-query {
	margin-block-start: 0;
}

[class*="is-style-ldx-card"]:has(> .wp-block-query:last-child) {
	padding-bottom: var(--wp--preset--spacing--20);
}

/* Translucent panel (hero "Featured Articles")
--------------------------------------------- */

.is-style-ldx-panel .wp-block-post-template > li {
	margin-block: 0;
}

.is-style-ldx-panel .wp-block-post-title a {
	text-decoration: none;
}

.is-style-ldx-panel .wp-block-post-author-name {
	display: flex;
	align-items: center;
	gap: 8px;
}

.is-style-ldx-panel .wp-block-post-author-name::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: url(assets/icons/circle-user.svg) center / contain no-repeat;
	mask: url(assets/icons/circle-user.svg) center / contain no-repeat;
}
