/* ============================================================ RAG-style top nav overrides Activates the cleaner /rag-style top nav on any page whose carries data-ad-page="rag" (or "samples" / "blog"). Pair with includes/main_navigation.html and the includes/minimal_nav_overrides.html JS shim. These rules are mirrored in static/css/rag-showcase.css for pages that already load that file. Keep the two in sync. ============================================================ */ /* Hide product links (Genie, DreamScape) and the trailing separator */ :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link--product { display: none !important; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link--product + .utility-bar__sep { display: none !important; } /* Bar shell: flat dark instead of rounded bubbles */ :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar { background: rgba(10, 7, 16, 0.85); border-bottom: 1px solid rgba(255, 255, 255, 0.04); padding: 14px 24px; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__brand-bubble { background: none; border: none; border-radius: 0; padding: 0; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__brand { font-size: 1.05rem; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__links-bubble { background: none; border: none; border-radius: 0; padding: 0; gap: 24px; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link { color: #94a3b8; font-size: 0.9rem; font-weight: 500; padding: 0; border-radius: 0; background: none; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link:hover { color: #e2e8f0; background: none; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link--active { color: #e2e8f0; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__sep { display: none; } /* Solid purple primary CTA */ :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__cta { background: #8b5cf6; color: #fff; padding: 10px 18px; border-radius: 8px; font-weight: 600; font-size: 0.9rem; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__cta:hover { background: #7c4ee6; color: #fff; transform: translateY(-1px); } /* Sign In as outlined secondary CTA (class added by minimal_nav_overrides.html) */ :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link--signin { border: 1px solid rgba(139, 92, 246, 0.5); color: #8b5cf6 !important; padding: 8px 16px; border-radius: 8px; font-weight: 600; font-size: 0.9rem; transition: all 0.2s; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link--signin:hover { border-color: #8b5cf6; background: rgba(139, 92, 246, 0.1) !important; color: #a78bfa !important; } /* Dropdown styling to match dark theme */ :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__dropdown { background: rgba(10, 7, 16, 0.95); border: 1px solid rgba(255, 255, 255, 0.08); } /* Mobile: restore a compact bubble for the open menu */ @media (max-width: 992px) { :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__links-bubble { background: rgba(10, 7, 16, 0.95); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; padding: 8px; gap: 2px; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link { padding: 10px 14px; border-radius: 8px; } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__link:hover { background: rgba(255, 255, 255, 0.08); } :is([data-ad-page="rag"], [data-ad-page="samples"], [data-ad-page="blog"]) .utility-bar__sep { display: block; width: 100%; height: 1px; margin: 4px 0; } }