/* ============================================================================= MAGENTO OVERRIDES FOR SHARED COMPONENTS Minimal overrides to integrate shared header/footer in Magento Luma theme ============================================================================= */ /* ----------------------------------------------------------------------------- CSS variable overrides — shared-base.css (loaded in ) overrides the theme variables from _variables.less (loaded in ). Re-apply the correct values here since magento-overrides.css loads AFTER shared-base.css. Only the 10 variables that actually diverge between the two sources are listed. ----------------------------------------------------------------------------- */ :root { /* Typography */ --font-font-family-primary: 'Inter', sans-serif; --font-font-family-secondary: Windsor Pro; --font-font-family-tertiary: acumin-pro-condensed; /* Note: --font-title-title-4-weight intentionally left at 750 (shared-base.css value). With 750, Windsor Pro resolves to WindsorStdUltraHeavyD (WindsorD-UltHea) via _typography_extend.less, matching the Fractal mockup. Setting 800 would instead pick WindsorProXBoldCn.TTF from fonts.css (loaded in shared-header), which diverges. */ /* Colors */ --color-red-600: #eb1b17; --primary-brand-600: #E4032F; /* Button ghost primary hover */ --button-color-primary-ghost-background-hover: var(--secondary-brand-600); --button-color-primary-ghost-border-hover: var(--secondary-brand-600); --button-color-primary-ghost-text-hover: var(--neutral-0); /* Z-index */ --zindex-sticky: 600; } /* ----------------------------------------------------------------------------- Page Header Layout ----------------------------------------------------------------------------- */ .page-header { margin: 0; padding: 0; border: none; } /* ----------------------------------------------------------------------------- Page Footer Layout ----------------------------------------------------------------------------- */ .page-footer { margin: 0; padding: 0; border: none; background: transparent; } .footer-container, .footer.content { margin: 0 !important; padding: 0 !important; border: none !important; } shared-footer { display: block; margin: 0; padding: 0; } /* ----------------------------------------------------------------------------- Reset Magento link styles inside shared components ----------------------------------------------------------------------------- */ shared-header a, shared-footer a { color: inherit; text-decoration: none; } shared-header a:hover, shared-footer a:hover { color: inherit; text-decoration: none; } /* ----------------------------------------------------------------------------- Reset Magento .block margin inside shared components ----------------------------------------------------------------------------- */ shared-header .block, shared-footer .block { margin-bottom: 0; } /* ----------------------------------------------------------------------------- Reset Magento button styles inside shared components ----------------------------------------------------------------------------- */ shared-header button, shared-footer button { background: none !important; background-color: transparent !important; border: none !important; box-shadow: none !important; } shared-header button:hover, shared-footer button:hover, shared-header button:focus, shared-header button:active, shared-footer button:focus, shared-footer button:active { background: none !important; background-color: transparent !important; border: none !important; box-shadow: none !important; } shared-header a.c-button--secondary.c-button--outlined { color: var(--secondary-brand-700); } shared-header a.c-button--primary.c-button--solid { color: var(--button-color-primary-solid-text-base); } /* ----------------------------------------------------------------------------- Fix: a:visited:not(:hover) (specificity 0,2,1) overrides .c-button (0,2,0) Scoped to pages where visited order links appear as buttons ----------------------------------------------------------------------------- */ .sales-order-history a.c-button--primary.c-button--solid:visited:not(:hover) { color: var(--button-color-primary-solid-text-base); } /* ----------------------------------------------------------------------------- Hamburger menu icon - Fix iOS Safari blue color (DEL-524) iOS Safari defaults