/* ICF site-wide header polish (v0.7.34) — restyle the Elementor header icons (language / cart /
 * login) + the injected notification bell, and align the NinjaTrader ecosystem logo lockup.
 * CSS-only, theme-matched (dark + blue/gold), reversible. No Elementor/theme structure changes. */

:root { --icfh-accent:#4f8cff; --icfh-accent2:#2f6df0; --icfh-gold:#e9c46a; --icfh-ink:#eaf0fb; }

/* ---------- modern header icon-chips (header.js tags cart + account with .icf-hicon at runtime) ----
 * Old look = white GTranslate box + red-bordered account pill + blue-bordered cart button. We
 * normalise them into one cohesive set of dark glassy rounded chips with an accent hover (matching
 * the bell). !important wins over Elementor/GTranslate per-element CSS; runtime tagging catches the
 * logged-in "Dear ..." element that no static selector can target. */
a.icf-hicon, .icf-hicon, #elementor-menu-cart__toggle_button.icf-hicon {
	display:inline-flex!important; align-items:center!important; gap:7px!important; height:38px!important;
	min-height:38px!important; padding:0 13px!important; margin:0 3px!important; box-sizing:border-box!important;
	border-radius:11px!important; background:rgba(255,255,255,.05)!important;
	border:1px solid rgba(255,255,255,.15)!important; color:var(--icfh-ink)!important;
	box-shadow:none!important; text-decoration:none!important; font-weight:600!important; line-height:1!important;
	transition:background .15s, border-color .15s, transform .12s, color .15s!important;
}
a.icf-hicon:hover, .icf-hicon:hover {
	background:rgba(79,140,255,.16)!important; border-color:var(--icfh-accent)!important;
	transform:translateY(-1px)!important; color:#fff!important;
}
.icf-hicon > *, .icf-hicon span, .icf-hicon i, .icf-hicon bdi, .icf-hicon .elementor-button-text {
	color:inherit!important; background:transparent!important; border:0!important; box-shadow:none!important;
}
.icf-hicon i { font-size:18px!important; line-height:1!important; }
.icf-hicon:hover i { color:var(--icfh-gold)!important; }

/* ---------- cart -> bare icon matching the bell (OUT of the box), distinct color, no price text ---------- */
#elementor-menu-cart__toggle_button.icf-cticon, .icf-cticon {
	display:inline-flex!important; align-items:center!important; justify-content:center!important;
	width:38px!important; height:38px!important; min-height:0!important; padding:0!important; margin:0 4px!important;
	background:transparent!important; border:1px solid transparent!important; border-radius:10px!important;
	box-shadow:none!important; vertical-align:middle!important; transition:background .15s, border-color .15s, transform .12s!important;
}
.icf-cticon:hover { background:rgba(255,255,255,.07)!important; border-color:rgba(255,255,255,.14)!important; transform:translateY(-1px)!important; }
.icf-cticon .elementor-button-text, .icf-cticon .woocommerce-Price-amount { display:none!important; } /* hide the £0 price */
.icf-cticon .elementor-button-icon { margin:0!important; padding:0!important; color:#79a8ff!important; }
.icf-cticon .elementor-button-icon svg { width:21px!important; height:21px!important; }
.icf-cticon .elementor-button-icon svg * { stroke:#79a8ff!important; }
.icf-cticon .elementor-button-icon i { font-size:21px!important; color:#79a8ff!important; }

/* keep all header controls the same height + vertically centred on one line */
.icf-hicon, .icf-bell, .icf-cticon { vertical-align:middle!important; align-self:center!important; }

/* --- header polish (2026-06-16): tighter cart gap, blue cart hover, simple account font --- */
/* tighten the cart-to-bell gap by zeroing the Elementor cart widget's own spacing */
#elementor-element-3fd7c60, #elementor-element-3fd7c60 .elementor-widget-container,
#elementor-element-3fd7c60 .elementor-menu-cart__toggle, #elementor-element-3fd7c60 .elementor-menu-cart__toggle_wrapper { margin:0!important; padding:0!important; }
.icf-cticon { margin:0 2px 0 -6px!important; }
/* cart hover -> blue background (ICF-logo blue), brighter icon (like the bell, but blue) */
.icf-cticon:hover { background:rgba(79,140,255,.22)!important; border-color:rgba(79,140,255,.45)!important; }
.icf-cticon:hover .elementor-button-icon, .icf-cticon:hover .elementor-button-icon i { color:#bcd4ff!important; }
.icf-cticon:hover .elementor-button-icon svg * { stroke:#bcd4ff!important; }
/* account "Dear Claude Builder" -> SAME font as the nav menu ("ABOUT US" = Elementor accent font
 * "Days One"), NO stroke, subtle emboss shadow. Uses the global var so it tracks the nav font. */
a[href*="/panel"].icf-hicon, a[href*="/panel"].icf-hicon * {
	-webkit-text-stroke:0!important; letter-spacing:0!important; text-transform:none!important;
	font-family:var(--e-global-typography-accent-font-family,'Days One'),sans-serif!important;
	font-weight:var(--e-global-typography-accent-font-weight,500)!important; font-size:14px!important;
	text-shadow:0 1px 2px rgba(0,0,0,.5)!important;
}

/* ---------- language: hide GTranslate's own white float widget, once our switcher is ready ---------- */
html.icf-lang-ready #gt-wrapper-79704038,
html.icf-lang-ready .gtranslate_wrapper,
html.icf-lang-ready .gt_float_wrapper,
html.icf-lang-ready .gt_float_switcher { display:none !important; }

/* ---------- custom dark language switcher (.icf-lang, built by header.js) ---------- */
.icf-lang { position:relative; gap:6px!important; }
.icf-lang__b { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:18px;
	padding:0 4px; border-radius:5px; background:rgba(255,255,255,.1); font:700 11px/1 'Inter',system-ui,sans-serif;
	letter-spacing:.04em; color:var(--icfh-ink); }
.icf-lang:hover .icf-lang__b { background:rgba(79,140,255,.28); }
.icf-lang__car { font-size:10px; opacity:.7; margin-left:1px; }
.icf-lang__menu { position:absolute; top:46px; left:0; z-index:99999; min-width:190px; max-height:340px; overflow:auto;
	display:none; text-align:left; background:linear-gradient(180deg,#141c2e,#0c121d); border:1px solid rgba(255,255,255,.1);
	border-radius:12px; padding:6px; box-shadow:0 30px 70px -28px rgba(0,0,0,.9); }
.icf-lang__menu.open { display:block; }
.icf-lang__opt { display:flex!important; align-items:center; gap:10px; width:100%; margin:0!important; padding:8px 10px!important;
	border:0!important; border-radius:8px!important; background:transparent!important; color:#eaf0fb!important;
	font:600 13px 'Inter',system-ui,sans-serif!important; cursor:pointer; text-align:left!important;
	-webkit-appearance:none!important; appearance:none!important; box-shadow:none!important; outline:none; text-transform:none!important; }
.icf-lang__opt:hover { background:rgba(79,140,255,.16)!important; }
.icf-lang__opt.is-cur { background:rgba(79,140,255,.22)!important; }
.icf-lang__opt .icf-lang__b { background:rgba(255,255,255,.08); }
.icf-lang__opt .icf-lang__n { white-space:nowrap; }

/* ---------- injected notification bell (logged-in customers) ---------- */
.icf-bell { position:relative; display:inline-flex; align-items:center; justify-content:center;
	width:38px; height:38px; margin:0 4px; border-radius:10px; cursor:pointer; vertical-align:middle;
	background:transparent; border:1px solid transparent; color:var(--icfh-ink);
	transition:background .15s, border-color .15s, transform .12s; }
.icf-bell:hover { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.14); transform:translateY(-1px); }
.icf-bell:focus-visible { outline:2px solid var(--icfh-accent); outline-offset:2px; }
.icf-bell svg { width:21px; height:21px; display:block; color:inherit; }
.icf-bell__badge { position:absolute; top:2px; right:2px; min-width:17px; height:17px; padding:0 4px;
	border-radius:999px; background:linear-gradient(180deg,#ff6b6b,#e23b3b); color:#fff;
	font:700 11px/17px 'Inter',system-ui,sans-serif; text-align:center; display:none;
	box-shadow:0 0 0 2px rgba(8,12,20,.65); }
.icf-bell.has-unread .icf-bell__badge { display:block; }
.icf-bell.has-unread svg { color:var(--icfh-gold); }
.icf-bell.has-unread { animation:icf-bell-pulse 1.8s ease-in-out infinite; }
@keyframes icf-bell-pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(233,196,106,0);} 50%{ box-shadow:0 0 0 6px rgba(233,196,106,.16);} }

.icf-bell__panel { position:absolute; top:46px; right:0; z-index:99999; width:300px; max-width:84vw;
	background:linear-gradient(180deg,#141c2e,#0c121d); color:var(--icfh-ink); text-align:left;
	border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:12px;
	box-shadow:0 30px 70px -28px rgba(0,0,0,.9); display:none; }
.icf-bell__panel.open { display:block; }
.icf-bell__panel h4 { margin:0 0 8px; font:700 14px 'Inter',system-ui,sans-serif; color:#fff; }
.icf-bell__list { list-style:none; margin:0 0 10px; padding:0; display:grid; gap:7px; max-height:240px; overflow:auto; }
.icf-bell__list li { font-size:12.5px; line-height:1.4; color:#cdd7ea; background:rgba(255,255,255,.04);
	border:1px solid rgba(255,255,255,.06); border-radius:9px; padding:8px 10px; }
.icf-bell__empty { font-size:12.5px; color:#7e8aa3; padding:4px 2px 10px; }
.icf-bell__cta { display:block; text-align:center; padding:9px; border-radius:9px; text-decoration:none;
	font:700 13px 'Inter',system-ui,sans-serif; color:#fff!important;
	background:linear-gradient(180deg,var(--icfh-accent),var(--icfh-accent2)); }
.icf-bell__cta:hover { filter:brightness(1.08); }

/* ---------- NinjaTrader "Approved Vendor" — align the NT icon under the wordmark ---------- */
/* the orange NT icon (wp-image-11340, 150x150) floats below-centre, disconnected from the
 * NINJATRADER ECOSYSTEM wordmark (wp-image-5010). Pull it up + centre so they read as one lockup. */
/* NinjaTrader orange icon -> sit under the "NINJATRADER" word, left-aligned with the wordmark (not centred). */
#elementor-element-c478374 { text-align:left !important; margin-top:-24px !important; }
#elementor-element-c478374 .elementor-widget-container { text-align:left !important; }
#elementor-element-c478374 .elementor-widget-container { margin-left:-250px !important; }
#elementor-element-c478374 a, #elementor-element-c478374 img.wp-image-11340 { display:inline-block !important; margin:0 !important; }
@media (max-width:768px){ #elementor-element-c478374 { margin-top:-10px !important; } }
