/* ========================================================= RUSHD HEADER V17 ORGANIC WEB — PREMIUM WEB INTERACTIONS Same EasyOrders DOM. CSS-driven visual layer only. ========================================================= */ :root{ --rushd-navy:#0E1F3D; --rushd-navy-deep:#081327; --rushd-red:#E43036; --rushd-cream:#F7F4EE; --rushd-white:#FFFFFF; --rushd-shadow:0 12px 28px rgba(8,19,39,.18); --rushd-ease:cubic-bezier(.22,.8,.22,1); } /* ---------- HEADER STATE ---------- */ nav.default_header_container.rushd-header-v17{ position:relative !important; width:100% !important; max-width:none !important; margin:0 !important; padding-inline:clamp(12px,2.2vw,28px) !important; color:var(--rushd-navy) !important; background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; overflow:visible !important; isolation:isolate; } nav.default_header_container.rushd-header-v17::before{ content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; opacity:0; transition:opacity .28s var(--rushd-ease), background .28s var(--rushd-ease), box-shadow .28s var(--rushd-ease); } nav.default_header_container.rushd-header-v17::after{ content:""; position:absolute; left:50%; bottom:0; width:min(92%,1280px); height:1px; transform:translateX(-50%) scaleX(0); transform-origin:center; background:linear-gradient(90deg,transparent 0%,rgba(228,48,54,.25) 12%,rgba(228,48,54,.95) 50%,rgba(228,48,54,.25) 88%,transparent 100%); box-shadow:0 0 14px rgba(228,48,54,.20); opacity:0; pointer-events:none; transition:transform .34s var(--rushd-ease), opacity .28s var(--rushd-ease); } nav.default_header_container.rushd-header-v17.is-home-overlay{ position:relative !important; inset:auto !important; width:100% !important; max-width:none !important; margin:0 !important; background:transparent !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } nav.default_header_container.rushd-header-v17.is-home-overlay::before{ content:none !important; display:none !important; } nav.default_header_container.rushd-header-v17.is-inner-page{ position:relative !important; inset:auto !important; } nav.default_header_container.rushd-header-v17.is-inner-page::before{ content:"" !important; display:block !important; position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; z-index:-1 !important; pointer-events:none !important; background-image: url("data:image/svg+xml,%0A%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20520%20230%22%3E%0A%20%20%3Cg%20fill=%22none%22%20stroke=%22%23E43036%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%0A%20%20%20%20%3C%21--%20uneven%20radial%20strands%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.20%22%20stroke-width=%221.25%22%20d=%22M56,-8%20C72,48%2096,106%20132,194%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.17%22%20stroke-width=%221.05%22%20d=%22M60,-6%20C117,30%20178,73%20252,139%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.15%22%20stroke-width=%221.15%22%20d=%22M59,-5%20C153,17%20252,38%20382,74%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.13%22%20stroke-width=%221.0%22%20d=%22M58,-4%20C178,3%20318,4%20500,15%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.16%22%20stroke-width=%221.1%22%20d=%22M57,-5%20C35,49%2018,104%209,171%22/%3E%0A%0A%20%20%20%20%3C%21--%20imperfect%20connecting%20arcs%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.22%22%20stroke-width=%221.2%22%20d=%22M37,28%20C58,22%2078,23%20102,35%20C87,52%2078,68%2074,83%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.19%22%20stroke-width=%221.05%22%20d=%22M23,58%20C49,49%2076,51%20111,67%20C98,84%2091,101%2089,120%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.16%22%20stroke-width=%221.15%22%20d=%22M11,93%20C47,79%2087,83%20135,104%20C122,125%20116,144%20118,163%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.14%22%20stroke-width=%221.0%22%20d=%22M4,132%20C47,112%2098,117%20160,145%20C149,164%20147,182%20151,199%22/%3E%0A%0A%20%20%20%20%3C%21--%20side%20arcs%20that%20break%20the%20geometry%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.14%22%20stroke-width=%221.0%22%20d=%22M102,35%20C137,31%20172,40%20211,60%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.12%22%20stroke-width=%221.0%22%20d=%22M111,67%20C151,63%20194,76%20240,103%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.11%22%20stroke-width=%22.95%22%20d=%22M135,104%20C179,104%20226,121%20277,155%22/%3E%0A%0A%20%20%20%20%3C%21--%20scratchy%20loose%20strands%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.10%22%20stroke-width=%22.85%22%20d=%22M176,18%20C197,24%20216,31%20237,44%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.09%22%20stroke-width=%22.9%22%20d=%22M201,92%20C218,96%20236,104%20255,116%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.08%22%20stroke-width=%22.8%22%20d=%22M296,40%20C322,45%20344,50%20367,58%22/%3E%0A%20%20%3C/g%3E%0A%3C/svg%3E%0A"), url("data:image/svg+xml,%0A%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20520%20230%22%3E%0A%20%20%3Cg%20fill=%22none%22%20stroke=%22%230E1F3D%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%0A%20%20%20%20%3C%21--%20uneven%20radial%20strands%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.15%22%20stroke-width=%221.1%22%20d=%22M474,238%20C451,181%20427,124%20393,48%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.13%22%20stroke-width=%221.0%22%20d=%22M476,236%20C424,201%20369,163%20300,102%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.11%22%20stroke-width=%221.05%22%20d=%22M476,237%20C387,217%20294,198%20183,169%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.10%22%20stroke-width=%22.95%22%20d=%22M476,238%20C365,234%20235,232%2078,222%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.12%22%20stroke-width=%221.0%22%20d=%22M477,238%20C492,196%20505,153%20512,103%22/%3E%0A%0A%20%20%20%20%3C%21--%20irregular%20arcs%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.16%22%20stroke-width=%221.1%22%20d=%22M497,204%20C473,211%20449,209%20421,196%20C434,181%20441,166%20444,151%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.14%22%20stroke-width=%221.0%22%20d=%22M508,177%20C476,188%20445,185%20407,168%20C421,151%20429,134%20431,116%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.12%22%20stroke-width=%221.0%22%20d=%22M516,145%20C479,159%20438,154%20392,132%20C405,113%20411,96%20410,79%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.10%22%20stroke-width=%22.9%22%20d=%22M519,111%20C475,129%20425,120%20368,93%20C379,76%20381,59%20378,44%22/%3E%0A%0A%20%20%20%20%3C%21--%20broken%20side%20arcs%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.10%22%20stroke-width=%22.9%22%20d=%22M421,196%20C387,199%20351,189%20314,170%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.09%22%20stroke-width=%22.85%22%20d=%22M407,168%20C369,169%20330,155%20286,130%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.08%22%20stroke-width=%22.8%22%20d=%22M392,132%20C350,132%20306,117%20258,86%22/%3E%0A%0A%20%20%20%20%3C%21--%20loose%20imperfections%20--%3E%0A%20%20%20%20%3Cpath%20opacity=%22.075%22%20stroke-width=%22.8%22%20d=%22M338,210%20C313,204%20290,196%20270,184%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.07%22%20stroke-width=%22.8%22%20d=%22M320,145%20C303,140%20286,132%20269,122%22/%3E%0A%20%20%20%20%3Cpath%20opacity=%22.065%22%20stroke-width=%22.75%22%20d=%22M222,195%20C198,190%20177,184%20155,175%22/%3E%0A%20%20%3C/g%3E%0A%3C/svg%3E%0A"), radial-gradient(circle at 12% 0%,rgba(228,48,54,.055),transparent 30%), linear-gradient(180deg,#FFFFFF 0%,var(--rushd-cream) 100%) !important; background-repeat: no-repeat, no-repeat, no-repeat, no-repeat !important; background-position: left top, right bottom, center, center !important; background-size: 43% 150%, 43% 150%, 100% 100%, 100% 100% !important; box-shadow:none !important; } nav.default_header_container.rushd-header-v17.is-inner-page::after{ content:none !important; display:none !important; } nav.default_header_container.rushd-header-v17 > div:first-child{ position:relative !important; max-width:1280px !important; min-height:74px !important; margin:0 auto !important; } /* ---------- LOGO ---------- */ nav.default_header_container.rushd-header-v17 .default_header_logo{ position:relative; z-index:4; } nav.default_header_container.rushd-header-v17 .default_header_logo a{ position:relative; display:inline-flex; align-items:center; justify-content:center; padding:4px 10px; border-radius:18px; transition:transform .26s var(--rushd-ease), filter .26s var(--rushd-ease); } nav.default_header_container.rushd-header-v17 .default_header_logo a::after{ content:""; position:absolute; left:50%; bottom:-2px; width:58%; height:2px; border-radius:999px; background:var(--rushd-red); transform:translateX(-50%) scaleX(0); transform-origin:center; box-shadow:0 0 12px rgba(228,48,54,.35); opacity:.9; transition:transform .28s var(--rushd-ease); } nav.default_header_container.rushd-header-v17 .default_header_logo a:hover, nav.default_header_container.rushd-header-v17 .default_header_logo a:focus-visible{ transform:translateY(-1px) scale(1.025); filter:drop-shadow(0 5px 14px rgba(228,48,54,.16)); } nav.default_header_container.rushd-header-v17 .default_header_logo a:hover::after, nav.default_header_container.rushd-header-v17 .default_header_logo a:focus-visible::after{ transform:translateX(-50%) scaleX(1); } nav.default_header_container.rushd-header-v17 .default_header_logo img{ height:56px !important; max-width:220px !important; width:auto !important; object-fit:contain !important; } /* ---------- ICON BUTTONS ---------- */ nav.default_header_container.rushd-header-v17 .rushd-action, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu{ position:relative !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:44px !important; height:44px !important; padding:0 !important; border:1px solid rgba(14,31,61,.10) !important; border-radius:14px !important; /* Same language as the menu buttons: idle = transparent glass hover = navy fill wipes in from the LEFT */ background-image: linear-gradient(90deg,#0E1F3D 0%,#0E1F3D 100%), linear-gradient(135deg,rgba(255,255,255,.42),rgba(247,244,238,.20)) !important; background-size: 0% 100%, 100% 100% !important; background-position: left top, left top !important; background-repeat:no-repeat !important; color:#E43036 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.70), 0 5px 14px rgba(14,31,61,.055) !important; -webkit-backdrop-filter:blur(10px) saturate(130%); backdrop-filter:blur(10px) saturate(130%); opacity:1 !important; filter:none !important; overflow:hidden; isolation:isolate; transform:translateZ(0); transition: transform .28s var(--rushd-ease), color .18s ease .10s, border-color .24s ease, box-shadow .28s var(--rushd-ease), background-size .38s cubic-bezier(.22,.8,.2,1); } nav.default_header_container.rushd-header-v17 .rushd-action::before, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu::before{ content:""; position:absolute; inset:-8px; z-index:-2; opacity:0; transform:scale(.55) rotate(-4deg); background: radial-gradient(circle at 50% 50%,transparent 0 17%,rgba(247,244,238,.62) 18% 19%,transparent 20%), repeating-conic-gradient(from 0deg at 50% 50%,rgba(247,244,238,.54) 0deg 1.35deg,transparent 1.35deg 32deg), radial-gradient(circle at 50% 50%,rgba(228,48,54,.20),transparent 58%); -webkit-mask:radial-gradient(circle at 50% 50%,transparent 0 18%,#000 19% 66%,transparent 67%); mask:radial-gradient(circle at 50% 50%,transparent 0 18%,#000 19% 66%,transparent 67%); transition:opacity .20s ease, transform .34s var(--rushd-ease); } nav.default_header_container.rushd-header-v17 .rushd-action::after, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu::after{ content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; border:1px solid transparent; background:linear-gradient(145deg,rgba(228,48,54,.82),rgba(247,244,238,.22),rgba(228,48,54,.62)) border-box; -webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .22s ease; } nav.default_header_container.rushd-header-v17 .rushd-action:hover, nav.default_header_container.rushd-header-v17 .rushd-action:focus-visible, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:hover, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:focus-visible{ transform:translateY(-3px) scale(1.025); color:#F7F4EE !important; border-color:rgba(228,48,54,.44) !important; /* Navy enters from the LEFT, exactly like menu buttons */ background-size: 100% 100%, 100% 100% !important; box-shadow: inset 0 1px 0 rgba(247,244,238,.12), 0 10px 22px rgba(14,31,61,.14), 0 0 0 1px rgba(228,48,54,.08), 0 0 18px rgba(228,48,54,.10) !important; } nav.default_header_container.rushd-header-v17 .rushd-action:hover::before, nav.default_header_container.rushd-header-v17 .rushd-action:focus-visible::before, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:hover::before, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:focus-visible::before{ opacity:.85; transform:scale(1) rotate(5deg); } nav.default_header_container.rushd-header-v17 .rushd-action:hover::after, nav.default_header_container.rushd-header-v17 .rushd-action:focus-visible::after, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:hover::after, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:focus-visible::after{ opacity:1; } nav.default_header_container.rushd-header-v17 .rushd-action svg, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu svg{ position:relative; z-index:2; width:23px !important; height:23px !important; color:#E43036 !important; opacity:1 !important; filter:none !important; transition: transform .24s var(--rushd-ease), color .18s ease .08s; } nav.default_header_container.rushd-header-v17 .rushd-action:hover svg, nav.default_header_container.rushd-header-v17 .rushd-action:focus-visible svg, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:hover svg, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:focus-visible svg{ color:#F7F4EE !important; transform:scale(1.06); filter:none !important; } /* ROOT SVG FIX — MASK SAFE The original EasyOrders search icon uses elements with WHITE mask paths. A previous blanket selector targeted every path inside the search SVG, including the mask-definition paths. Recoloring those mask paths from white to brand red reduces mask luminance and makes the visible search icon look pale / washed out. Fix: - NEVER recolor paths inside . - Style only the visible paths that are direct children of the visible . - Keep the cart on its native currentColor stroke model. */ /* Search button / SVG container */ nav.default_header_container.rushd-header-v17 .rushd-search, nav.default_header_container.rushd-header-v17 .rushd-search svg{ color:#E43036 !important; opacity:1 !important; filter:none !important; } nav.default_header_container.rushd-header-v17 .rushd-search svg{ width:23px !important; height:23px !important; overflow:visible !important; } /* Critical: preserve mask definitions exactly as masks — white, untouched. */ nav.default_header_container.rushd-header-v17 .rushd-search svg mask path{ fill:#FFFFFF !important; stroke:none !important; opacity:1 !important; } /* Recolor ONLY the visible search artwork, not the mask paths. */ nav.default_header_container.rushd-header-v17 .rushd-search svg > g > path{ fill:#E43036 !important; stroke:none !important; opacity:1 !important; } /* Hover: visible artwork becomes cream; mask remains white. */ nav.default_header_container.rushd-header-v17 .rushd-search:hover, nav.default_header_container.rushd-header-v17 .rushd-search:focus-visible, nav.default_header_container.rushd-header-v17 .rushd-search:hover svg, nav.default_header_container.rushd-header-v17 .rushd-search:focus-visible svg{ color:#F7F4EE !important; } nav.default_header_container.rushd-header-v17 .rushd-search:hover svg > g > path, nav.default_header_container.rushd-header-v17 .rushd-search:focus-visible svg > g > path{ fill:#F7F4EE !important; } /* Cart: preserve its native stroke-based drawing model. */ nav.default_header_container.rushd-header-v17 .rushd-cart, nav.default_header_container.rushd-header-v17 .rushd-cart svg{ color:#E43036 !important; opacity:1 !important; filter:none !important; } nav.default_header_container.rushd-header-v17 .rushd-cart svg{ width:24px !important; height:24px !important; overflow:visible !important; } nav.default_header_container.rushd-header-v17 .rushd-cart svg path{ stroke:currentColor !important; opacity:1 !important; } nav.default_header_container.rushd-header-v17 .rushd-cart svg path[fill]:not([fill="none"]){ fill:currentColor !important; } nav.default_header_container.rushd-header-v17 .rushd-cart svg path[fill="none"]{ fill:none !important; } nav.default_header_container.rushd-header-v17 .rushd-cart:hover, nav.default_header_container.rushd-header-v17 .rushd-cart:focus-visible, nav.default_header_container.rushd-header-v17 .rushd-cart:hover svg, nav.default_header_container.rushd-header-v17 .rushd-cart:focus-visible svg{ color:#F7F4EE !important; } /* ---------- DESKTOP NAV ---------- */ @media (min-width:1024px){ nav.default_header_container.rushd-header-v17 .rushd-mobile-menu{ display:none !important; visibility:hidden !important; pointer-events:none !important; position:absolute !important; width:0 !important; height:0 !important; overflow:hidden !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav{ display:block !important; max-width:1280px !important; margin:0 auto !important; padding:0 0 14px !important; background:transparent !important; border:0 !important; box-shadow:none !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav > div{ display:flex !important; align-items:center !important; justify-content:center !important; gap:clamp(10px,1.45vw,18px) !important; width:max-content !important; max-width:100% !important; margin:0 auto !important; } /* Transparent glass idle + navy wipe layer from the LEFT on hover */ nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a{ position:relative; z-index:1; display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:38px !important; padding:0 15px !important; color:#E43036 !important; text-decoration:none !important; font-size:12px !important; font-weight:800 !important; line-height:1 !important; letter-spacing:.012em !important; white-space:nowrap !important; border:1px solid rgba(14,31,61,.10) !important; border-radius:11px !important; /* FIRST layer = navy fill. SECOND layer = permanent transparent glass. Only the FIRST layer grows from 0% to 100%. */ background-image: linear-gradient(90deg,#0E1F3D 0%,#0E1F3D 100%), linear-gradient(135deg,rgba(255,255,255,.42),rgba(247,244,238,.20)) !important; background-size: 0% 100%, 100% 100% !important; background-position: left top, left top !important; background-repeat:no-repeat !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.70), 0 5px 14px rgba(14,31,61,.055) !important; -webkit-backdrop-filter:blur(10px) saturate(130%); backdrop-filter:blur(10px) saturate(130%); transform:translateZ(0); overflow:visible !important; isolation:isolate; transition: transform .28s var(--rushd-ease), color .18s ease .10s, border-color .24s ease, box-shadow .28s var(--rushd-ease), background-size .38s cubic-bezier(.22,.8,.2,1); } /* Scratch / brush underline: intentionally irregular, split, slightly skewed and clipped instead of a clean line. */ nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a::before{ content:""; position:absolute; left:50%; bottom:-9px; z-index:2; width:calc(100% - 18px); height:5px; background: linear-gradient( 93deg, transparent 0 3%, rgba(228,48,54,.92) 4% 22%, transparent 23% 27%, rgba(228,48,54,.78) 28% 52%, transparent 53% 56%, rgba(228,48,54,.96) 57% 86%, transparent 87% 100% ); clip-path:polygon( 0 52%, 8% 38%, 17% 55%, 29% 31%, 39% 56%, 50% 35%, 61% 58%, 73% 29%, 84% 54%, 100% 37%, 100% 73%, 88% 62%, 77% 78%, 65% 60%, 52% 82%, 41% 62%, 29% 80%, 17% 61%, 7% 76%, 0 68% ); transform:translateX(-50%) scaleX(0) rotate(-1.4deg); transform-origin:50% 50%; opacity:0; filter:drop-shadow(0 1px 0 rgba(14,31,61,.10)); transition: transform .30s var(--rushd-ease), opacity .18s ease; } /* Web energy behind the glass tile on hover. */ nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a::after{ content:""; position:absolute; left:50%; top:50%; z-index:-1; width:calc(100% + 20px); height:calc(100% + 12px); transform:translate(-50%,-50%) scale(.68) rotate(-3deg); opacity:0; pointer-events:none; background: radial-gradient(circle at 50% 50%,transparent 0 18%,rgba(228,48,54,.34) 19% 20%,transparent 21%), repeating-conic-gradient(from 8deg at 50% 50%,rgba(228,48,54,.42) 0deg 1.25deg,transparent 1.25deg 38deg), radial-gradient(ellipse at 50% 50%,rgba(228,48,54,.09),transparent 62%); -webkit-mask:radial-gradient(ellipse at 50% 50%,transparent 0 23%,#000 25% 72%,transparent 74%); mask:radial-gradient(ellipse at 50% 50%,transparent 0 23%,#000 25% 72%,transparent 74%); transition: opacity .18s ease .03s, transform .36s var(--rushd-ease); } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:hover, nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:focus-visible{ color:#F7F4EE !important; transform:translateY(-3px) scale(1.015); border-color:rgba(228,48,54,.44) !important; /* Navy physically sweeps from left to right */ background-size: 100% 100%, 100% 100% !important; box-shadow: inset 0 1px 0 rgba(247,244,238,.12), 0 10px 22px rgba(14,31,61,.14), 0 0 0 1px rgba(228,48,54,.08), 0 0 18px rgba(228,48,54,.10) !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:hover::before, nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:focus-visible::before{ opacity:1; transform:translateX(-50%) scaleX(1) rotate(-1.4deg); } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:hover::after, nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a:focus-visible::after{ opacity:.78; transform:translate(-50%,-50%) scale(1) rotate(2.5deg); } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a.is-active{ color:#E43036 !important; border-color:rgba(228,48,54,.24) !important; background-size: 0% 100%, 100% 100% !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a.is-active:hover, nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a.is-active:focus-visible{ color:#F7F4EE !important; background-size: 100% 100%, 100% 100% !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a.is-active::before{ opacity:.92; transform:translateX(-50%) scaleX(1) rotate(-1.4deg); } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a.is-active::after{ opacity:.30; transform:translate(-50%,-50%) scale(.90) rotate(1deg); } } /* Keep the color wipe anchored to the LEFT edge on every state change. */ @media (min-width:1024px){ nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a{ background-origin:border-box !important; background-clip:padding-box,border-box !important; } } /* ---------- MOBILE ---------- */ @media (max-width:1023px){ nav.default_header_container.rushd-header-v17{ padding-inline:12px !important; } nav.default_header_container.rushd-header-v17 > div:first-child{ min-height:68px !important; } nav.default_header_container.rushd-header-v17 .default_header_logo img{ height:48px !important; max-width:170px !important; } nav.default_header_container.rushd-header-v17 .rushd-action, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu{ width:40px !important; height:40px !important; border-radius:13px !important; } nav.default_header_container.rushd-header-v17 .rushd-action:active, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:active{ transform:scale(.96); } nav.default_header_container.rushd-header-v17 .rushd-action:active::before, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu:active::before{ opacity:.9; transform:scale(1.06) rotate(4deg); } } @media (max-width:390px){ nav.default_header_container.rushd-header-v17{ padding-inline:8px !important; } nav.default_header_container.rushd-header-v17 .default_header_logo img{ height:43px !important; max-width:145px !important; } nav.default_header_container.rushd-header-v17 .rushd-action, nav.default_header_container.rushd-header-v17 .rushd-mobile-menu{ width:37px !important; height:37px !important; } } @media (prefers-reduced-motion:reduce){ nav.default_header_container.rushd-header-v17, nav.default_header_container.rushd-header-v17 *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; } } /* ========================================================= V9 — HOME FLOW FIX Transparent home header without absolute positioning. ========================================================= */ nav.default_header_container.rushd-header-v17.is-home-overlay{ position:relative !important; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important; inset:auto !important; transform:none !important; } nav.default_header_container.rushd-header-v17.is-home-overlay, nav.default_header_container.rushd-header-v17.is-home-overlay > div{ box-sizing:border-box !important; } /* Keep the EasyOrders sticky wrapper from collapsing/overlaying hero on home. */ body:has(nav.default_header_container.rushd-header-v17.is-home-overlay) .default_header{ position:relative !important; background:transparent !important; } /* If :has is supported, make the wrapper transparent but preserve its height. */ body:has(nav.default_header_container.rushd-header-v17.is-home-overlay) .default_header_container{ background:transparent !important; } /* ========================================================= V9 — MENU LABEL TRUE CENTERING ========================================================= */ @media (min-width:1024px){ nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a{ display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:38px !important; height:38px !important; padding:0 15px !important; line-height:1 !important; vertical-align:middle !important; } nav.default_header_container.rushd-header-v17 .rushd-desktop-nav a::before{ /* keep scratch underline OUTSIDE the button */ bottom:-9px !important; } } /* ========================================================= V11 CLEAN — SPACING FIX ONLY ========================================================= */ header.default_header:has(nav.default_header_container.rushd-header-v17){ padding-top:0 !important; padding-bottom:10px !important; margin-top:0 !important; } nav.default_header_container.rushd-header-v17{ padding-top:0 !important; margin-top:0 !important; } nav.default_header_container.rushd-header-v17 > div:first-child{ margin-top:0 !important; } /* ========================================================= V14 — PURE TRANSPARENT HOME Only buttons / SVG controls keep the glass treatment. ========================================================= */ /* EasyOrders outer sticky wrapper */ body:has(nav.default_header_container.rushd-header-v17.is-home-overlay) div.bg-white.sticky.top-0.w-full.z-30{ background:transparent !important; border:0 !important; border-bottom:0 !important; box-shadow:none !important; } /* Header itself */ body:has(nav.default_header_container.rushd-header-v17.is-home-overlay) header.default_header{ background:transparent !important; border:0 !important; border-bottom:0 !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } /* Nav container */ nav.default_header_container.rushd-header-v17.is-home-overlay{ background:transparent !important; border:0 !important; border-bottom:0 !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } /* Kill all decorative overlays on HOME */ nav.default_header_container.rushd-header-v17.is-home-overlay::before, nav.default_header_container.rushd-header-v17.is-home-overlay::after{ content:none !important; display:none !important; background:none !important; box-shadow:none !important; } /* Desktop nav wrapper itself must also remain completely transparent */ nav.default_header_container.rushd-header-v17.is-home-overlay .rushd-desktop-nav, nav.default_header_container.rushd-header-v17.is-home-overlay .rushd-desktop-nav > div{ background:transparent !important; border:0 !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } /* Remove EasyOrders desktop divider/shadow globally from our customized header */ body:has(nav.default_header_container.rushd-header-v17) div.bg-white.sticky.top-0.w-full.z-30{ border-bottom:0 !important; box-shadow:none !important; } /* IMPORTANT: Glass stays ONLY on: - menu link buttons - search - cart - mobile menu button No full-header glass layer is allowed on home. */ /* ========================================================= V16 — STATE LOCK ========================================================= */ /* HOME: absolutely no web/background/divider on the header itself */ nav.default_header_container.rushd-header-v17.is-home-overlay::before, nav.default_header_container.rushd-header-v17.is-home-overlay::after{ content:none !important; display:none !important; } /* INNER: nav content stays above the web texture */ nav.default_header_container.rushd-header-v17.is-inner-page{ position:relative !important; isolation:isolate !important; } nav.default_header_container.rushd-header-v17.is-inner-page > *{ position:relative; z-index:1; } /* ========================================================= V17 — ORGANIC WEB FINISH ========================================================= */ nav.default_header_container.rushd-header-v17.is-inner-page::before{ opacity:1 !important; mix-blend-mode:normal !important; } /* HOME remains 100% transparent: no web texture at all. */ nav.default_header_container.rushd-header-v17.is-home-overlay::before, nav.default_header_container.rushd-header-v17.is-home-overlay::after{ content:none !important; display:none !important; }