/**
 * Love Pharm · Footer — the two changes the owner asked for on the Elementor footer (template 8582), nothing else.
 *
 * The footer is the owner's, built in Elementor; its data is never edited from here. Everything on it — the links,
 * the columns, the spacing, the hairlines, the copyright, the phone accordion and its behaviour — stays exactly as
 * Elementor renders it. This file only:
 *   1. takes the bold off the group titles — desktop 600 (was 700), the phone accordion 400 (was 700):
 *      the owner, 2026-10-12: "פוטר - בdesktop אהבתי שהורדת לו את הbold. בmobile אפשר גם להוריד את הbold, אבל אל
 *      תשנה את המבנה למה שעשית, אני אוהב שזה סרגל עם הפלוסים שיש שם כבר";
 *   2. draws the accordion's + and − as thin lines (the signed demo's 14px glyph, a 1.25px stroke) in place of
 *      Font Awesome's solid glyphs — the owner, 2026-10-13: "אני רוצה להוריד את הbold קצת גם מה+ שבתמונה, הוא סתם
 *      בולט מידי בלי סיבה". The control is Elementor's own (its <summary>, its open / closed spans and their
 *      switching); only the glyph's drawing changes: the solid SVG gives way to a mask of the thin one, painted in
 *      the accordion's own icon colour.
 *
 * Loaded on every page by the assets/css auto-loader (functions.php). Selectors are class-only and tolerate
 * Elementor's wrappers (`.elementor-location-footer` = the footer location, any template). The desktop weight needs
 * !important: Elementor's per-element rules (`.elementor-8582 .elementor-element.elementor-element-<id>
 * .elementor-heading-title`) outrank any class-only selector, and an id-keyed one would break when the owner edits
 * the template. Design checks: tests/styles/footer.json. Decision:
 * brain love-pharm/design/decisions/2026-10-13-reviews-footer-badge.
 */

:root {
	--lp-foot-title-weight: 600;   /* desktop group titles (live: 700) */
	--lp-foot-title-weight-m: 400; /* the phone / tablet accordion's titles (live: 700) */
	--lp-foot-pm: 14px;            /* the + / − glyph's box (the demo's) */
	/* the thin glyphs: 13px lines, a 1.25px stroke, centred in the 14px box (the demo's SVG, 2026-10-13) */
	--lp-foot-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000' stroke-width='1.25'%3E%3Cpath d='M7 .5v13M.5 7h13'/%3E%3C/svg%3E");
	--lp-foot-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000' stroke-width='1.25'%3E%3Cpath d='M.5 7h13'/%3E%3C/svg%3E");
}

/* 1 — the group titles: desktop columns (heading widgets) and the accordion's rows */
.elementor-location-footer .elementor-widget-heading .elementor-heading-title {
	font-weight: var(--lp-foot-title-weight) !important;
}
.elementor-location-footer .e-n-accordion-item-title,
.elementor-location-footer .e-n-accordion-item-title-text {
	font-weight: var(--lp-foot-title-weight-m);
}

/* 2 — the + / −: the open / closed spans keep Elementor's switching (display flex / none); each becomes a 14px box
 * painted in the accordion's icon colour through the thin glyph's mask, and the solid Font Awesome SVG inside gives way.
 * `.e-n-accordion` in the chain outranks Elementor's own `.elementor-widget-n-accordion .e-n-accordion-item-title-icon span`
 * (its size), whatever order the two stylesheets load in. */
.elementor-location-footer .e-n-accordion .e-n-accordion-item-title-icon > span {
	width: var(--lp-foot-pm);
	height: var(--lp-foot-pm);
	background-color: var(--n-accordion-icon-normal-color, currentColor);
	-webkit-mask: var(--lp-foot-plus) center / var(--lp-foot-pm) var(--lp-foot-pm) no-repeat;
	mask: var(--lp-foot-plus) center / var(--lp-foot-pm) var(--lp-foot-pm) no-repeat;
}
.elementor-location-footer .e-n-accordion .e-n-accordion-item-title-icon > .e-opened {
	background-color: var(--n-accordion-icon-active-color, currentColor);
	-webkit-mask-image: var(--lp-foot-minus);
	mask-image: var(--lp-foot-minus);
}
.elementor-location-footer .e-n-accordion .e-n-accordion-item-title-icon > span > svg,
.elementor-location-footer .e-n-accordion .e-n-accordion-item-title-icon > span > i {
	display: none;
}
