/*
 * PIM Builder — base styles for non-Avada themes.
 *
 * Avada normally supplies global colour/typography variables, its icon font,
 * screen-size visibility classes, its Menu and Modal elements and button
 * styles. This file provides equivalents mapped to the active theme's
 * palette (theme.json presets), so elements inherit the brand automatically.
 */

/* ---------- Avada global variables -> theme palette ---------- */
:root {
	--awb-color1: var(--wp--preset--color--base, #ffffff);
	--awb-color2: var(--wp--preset--color--tint, #f6f6f6);
	--awb-color3: var(--wp--preset--color--border, #e2e2e2);
	--awb-color4: var(--wp--preset--color--primary, #65bc7b);
	--awb-color5: var(--wp--preset--color--primary, #65bc7b);
	--awb-color6: var(--wp--preset--color--muted, #5d5d5d);
	--awb-color7: var(--wp--preset--color--contrast, #333333);
	--awb-color8: var(--wp--preset--color--deep, #212934);
	--primary_color: var(--wp--preset--color--primary, #65bc7b);
	--link_color: var(--wp--preset--color--deep, #212934);
	--awb-typography1-font-family: var(--wp--preset--font-family--display, inherit);
	--awb-typography2-font-family: var(--wp--preset--font-family--display, inherit);
	--awb-typography3-font-family: var(--wp--preset--font-family--body, inherit);
	--awb-typography4-font-family: var(--wp--preset--font-family--body, inherit);
	--awb-typography5-font-family: var(--wp--preset--font-family--body, inherit);
	--awb-typography4-font-size: var(--wp--preset--font-size--medium, 1rem);
	--accordion_divider_color: var(--awb-color3);
	--accordion_divider_hover_color: var(--awb-color3);
	--accordian_inactive_color: var(--awb-color8);
	--pim-z-backdrop: 99999;
}

/* ---------- Avada icon font equivalents (Font Awesome) ---------- */
.awb-icon-plus,
.awb-icon-minus,
.awb-icon-angle-down,
.awb-icon-angle-up,
.awb-icon-angle-left,
.awb-icon-angle-right,
.awb-icon-close {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
}
.awb-icon-plus:before { content: "\2b"; }
.awb-icon-minus:before { content: "\f068"; }
.awb-icon-angle-down:before { content: "\f107"; }
.awb-icon-angle-up:before { content: "\f106"; }
.awb-icon-angle-left:before { content: "\f104"; }
.awb-icon-angle-right:before { content: "\f105"; }
.awb-icon-close:before { content: "\f00d"; }

/* ---------- Screen-size visibility (Avada breakpoints) ---------- */
@media (max-width: 640px) {
	.fusion-no-small-visibility { display: none !important; }
}
@media (min-width: 641px) and (max-width: 1024px) {
	.fusion-no-medium-visibility { display: none !important; }
}
@media (min-width: 1025px) {
	.fusion-no-large-visibility { display: none !important; }
}
.fusion-clearfix::after { content: ""; display: table; clear: both; }

/* ---------- Block wrappers ---------- */
.wp-block-pim { box-sizing: border-box; }
.wp-block-pim *, .wp-block-pim *::before, .wp-block-pim *::after { box-sizing: border-box; }
.wp-block-pim img { max-width: 100%; }
/* Elements bring their own spacing; stop theme flow spacing doubling it. */
.wp-block-pim > style:first-child + * { margin-top: 0; }

/* ---------- Avada Menu element fallback ([fusion_menu]) ---------- */
.awb-menu.pim-compat-menu ul { list-style: none; margin: 0; padding: 0; }
.awb-menu.pim-compat-menu .awb-menu__main-ul { display: flex; flex-wrap: wrap; align-items: center; }
.awb-menu.pim-compat-menu.awb-menu_column .awb-menu__main-ul { flex-direction: column; align-items: stretch; }
.awb-menu.pim-compat-menu li { position: relative; }
.awb-menu.pim-compat-menu a { display: inline-flex; align-items: center; text-decoration: none; }
.awb-menu.pim-compat-menu .awb-menu__open-nav-submenu_click {
	background: none; border: 0; padding: 0 0 0 .35em; margin: 0; cursor: pointer; color: inherit; font: inherit; line-height: 1;
}

/* dropdown mode (top bar) */
.awb-menu.pim-compat-menu.awb-menu_dropdown .awb-menu__main-li { display: flex; align-items: center; }
.awb-menu.pim-compat-menu.awb-menu_dropdown .awb-menu__main-li > .awb-menu__open-nav-submenu_click:empty::after {
	content: "\f107"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: .75em;
}
.awb-menu.pim-compat-menu.awb-menu_dropdown .awb-menu__sub-ul {
	position: absolute; top: 100%; left: 0; min-width: 220px; z-index: 1000;
	background: var(--pim-dd-bg, #fff); box-shadow: 0 10px 30px rgba(0,0,0,.12);
	opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.awb-menu.pim-compat-menu.awb-menu_dropdown .awb-menu__sub-ul .awb-menu__sub-ul { top: 0; left: 100%; }
.awb-menu.pim-compat-menu.awb-menu_dropdown li:hover > .awb-menu__sub-ul,
.awb-menu.pim-compat-menu.awb-menu_dropdown li:focus-within > .awb-menu__sub-ul,
.awb-menu.pim-compat-menu.awb-menu_dropdown li.expanded > .awb-menu__sub-ul { opacity: 1; visibility: visible; transform: none; }
.awb-menu.pim-compat-menu.awb-menu_dropdown .awb-menu__sub-a { display: flex; width: 100%; padding: 9px 18px; }

/* stacked mode (slide-out modal menu) */
.awb-menu.pim-compat-menu.awb-menu_stacked li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.awb-menu.pim-compat-menu.awb-menu_stacked li > a { flex: 1 1 auto; }
.awb-menu.pim-compat-menu.awb-menu_stacked li > .awb-menu__sub-ul {
	flex: 0 0 100%; display: none; padding-left: var(--pim-submenu-indent, 10px);
}
.awb-menu.pim-compat-menu.awb-menu_stacked li.expanded > .awb-menu__sub-ul { display: block; }

/* ---------- Bootstrap-style buttons used by PIM Menu CTAs ----------
 * Zero-specificity (:where) so the elements' own CSS (e.g. hiding the mobile
 * call button on desktop) always wins. */
:where(.pim-menu, .wp-block-pim) :where(.btn) {
	align-items: center; justify-content: center; gap: .4em;
	padding: .75em 1.4em; border: 2px solid transparent; border-radius: 2px;
	font-family: inherit; font-size: .875rem; font-weight: 600; line-height: 1.2;
	text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	background: var(--wp--preset--color--secondary, #f3a630); color: var(--wp--preset--color--deep, #0b1e3f);
}
:where(.pim-menu, .wp-block-pim) :where(.btn):hover { background: var(--wp--preset--color--deep, #0b1e3f); color: var(--wp--preset--color--base, #fff); }
:where(.pim-menu, .wp-block-pim) :where(.btn-pill) { border-radius: 999px; }
:where(.pim-menu, .wp-block-pim) :where(.btn-secondary) { background: var(--wp--preset--color--deep, #0b1e3f); color: var(--wp--preset--color--base, #fff); }
:where(.pim-menu, .wp-block-pim) :where(.btn-secondary):hover { background: var(--wp--preset--color--primary, #79b136); }
:where(.pim-menu, .wp-block-pim) :where(.btn-outline, .btn-outline-primary) { background: transparent; border-color: currentColor; color: var(--wp--preset--color--deep, #0b1e3f); }
:where(.pim-menu) :where(.custom-logo-link img) { display: block; height: auto; }
.pim-site-title { font-weight: 700; font-size: 1.25rem; text-decoration: none; color: inherit; }

/* ---------- Modal (Avada Modal element replacement: PIM Modal block) ---------- */
.fusion-modal.pim-modal { display: none; }
.pim-modal {
	position: fixed; inset: 0; z-index: 100000; display: none;
	align-items: center; justify-content: center; padding: 24px;
}
.pim-modal.is-open { display: flex; }
.pim-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.6); }
.pim-modal__dialog {
	position: relative; z-index: 1; width: 100%; max-width: var(--pim-modal-width, 720px); max-height: calc(100vh - 48px); overflow: auto;
	background: var(--pim-modal-bg, var(--wp--preset--color--base, #fff)); color: var(--wp--preset--color--contrast, #333);
	border-radius: var(--pim-modal-radius, 4px); padding: clamp(20px, 4vw, 40px); box-shadow: 0 20px 60px rgba(0,0,0,.25);
	animation: pim-modal-in .2s ease;
}
.pim-modal__title { margin: 0 2.5rem 1rem 0; }
.pim-modal__close {
	position: absolute; top: 10px; right: 12px; width: 40px; height: 40px; border: 0; background: none;
	font-size: 28px; line-height: 1; cursor: pointer; color: inherit;
}
.pim-modal__body > :first-child { margin-top: 0; }
.pim-modal__body > :last-child { margin-bottom: 0; }
body.pim-modal-open { overflow: hidden; }
@keyframes pim-modal-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pim-modal__dialog { animation: none; } }

/* ---------- PIM Menu: default hamburger when no toggle image is uploaded ---------- */
.pim-menu__toggle-icon:empty {
	position: relative;
	color: var(--pim-tog-color, currentColor);
}
.pim-menu__toggle-icon:empty::before {
	content: "\f0c9";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	font-size: 0.85em; line-height: 1;
}
.pim-menu__toggle-icon:empty { font-size: inherit; }
.pim-menu__toggle .pim-menu__toggle-icon:empty { font-size: 24px; }

/* PIM Menu: phone icon on the mobile call button when no image is uploaded. */
.pim-menu__cta--mobile:not(.pim-menu__cta--mobile-text):not(:has(img))::before {
	content: "\f095";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 18px;
	line-height: 1;
	color: var(--wp--preset--color--base, #fff);
}

/* ---------- Side gutters for wide blocks on narrower screens ----------
 * Wide-aligned blocks would otherwise touch the screen edges on full-width
 * templates once the viewport is narrower than the theme's wide size. */
@media (max-width: 1200px) {
	.is-layout-constrained > .wp-block-pim.alignwide,
	.is-layout-constrained > .wp-block-pim:not(.alignfull):not(.alignwide) {
		padding-left: var(--wp--style--root--padding-left, 1.25rem);
		padding-right: var(--wp--style--root--padding-right, 1.25rem);
	}
}
.wp-block-pim-menu.alignfull { padding-left: 0; padding-right: 0; }

/* Slide-out (stacked) menu rows: treat the element's "item height" as a
 * minimum so longer labels and submenus never overlap. */
.pim-menu .pim-menu__modal .pim-modal-menu.pim-compat-menu.awb-menu_column .awb-menu__main-ul a {
	height: auto !important;
	min-height: var(--pim-mm-height, 40px);
	padding-top: .55em;
	padding-bottom: .55em;
	line-height: 1.3;
}
.pim-menu .pim-menu__modal .pim-modal-menu.pim-compat-menu.awb-menu_column .awb-menu__sub-ul a { padding-top: .4em; padding-bottom: .4em; }
.pim-menu .pim-menu__modal .pim-modal-menu.pim-compat-menu.awb-menu_column .awb-menu__main-li > .awb-menu__open-nav-submenu_click { align-self: center; }

/* Mobile Video: the phone mockup is designed for a narrow column (in Avada it
 * sits inside one). As a block, keep it phone-sized and centred; it still
 * shrinks to fit inside narrower containers such as Columns. */
.wp-block-pim.wp-block-pim-mobile-video.wp-block-pim-mobile-video { max-width: var(--pim-mobile-video-max-width, 420px); margin-left: auto !important; margin-right: auto !important; }