/* ============================================================ FİYATOMATİK UI-A6.5-F3 PREMIUM SINGLE-ROW HEADER TYPOGRAPHY Goal: - keep current F2 single-row architecture - darker navigation text - larger navigation typography - stronger hierarchy - cleaner professional desktop appearance ============================================================ */ /* ======================================================== HEADER BASE ======================================================== */ html body .ft-header { background: #ffffff !important; border-bottom: 1px solid #e7eaf0 !important; box-shadow: 0 3px 14px rgba(18, 28, 45, .035) !important; } /* ======================================================== BRAND ======================================================== */ html body .ft-header-main > .ft-brand { top: 8px !important; gap: 10px !important; } html body .ft-header-main > .ft-brand .ft-brand-mark { width: 40px !important; height: 40px !important; min-width: 40px !important; border-radius: 12px !important; font-size: 21px !important; font-weight: 850 !important; box-shadow: 0 6px 16px rgba(72,79,218,.19) !important; } html body .ft-header-main > .ft-brand .ft-brand-copy strong { color: #101827 !important; font-size: 16px !important; line-height: 1.08 !important; font-weight: 850 !important; letter-spacing: -.025em !important; } html body .ft-header-main > .ft-brand .ft-brand-copy small { margin-top: 2px !important; color: #77808f !important; font-size: 9.5px !important; line-height: 1.15 !important; font-weight: 500 !important; letter-spacing: .01em !important; } /* ======================================================== NAVIGATION ROW ======================================================== */ html body .ft-engine-nav { min-height: 58px !important; background: #ffffff !important; border-top: 0 !important; border-bottom: 1px solid #e8ebf0 !important; } html body .ft-engine-nav-inner { min-height: 58px !important; gap: 3px !important; padding-left: 238px !important; overflow: visible !important; } /* ======================================================== ENGINE MENU TYPOGRAPHY Main requested improvement. ======================================================== */ html body .ft-engine-nav-inner > a:not(.ft-product-link) { position: relative !important; padding: 9px 7px !important; border-radius: 8px !important; color: #151b27 !important; font-size: 11.5px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: -.018em !important; text-decoration: none !important; opacity: 1 !important; transition: color .16s ease, background .16s ease, transform .16s ease !important; } /* More visible hover without visual noise */ html body .ft-engine-nav-inner > a:not(.ft-product-link):hover { color: #315cff !important; background: #f2f5ff !important; transform: translateY(-1px) !important; } /* ======================================================== ARAMA MERKEZİ ======================================================== */ html body .ft-engine-nav-inner > .ft-product-link { min-height: 34px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 14px !important; margin-right: 6px !important; border-radius: 10px !important; color: #ffffff !important; font-size: 11px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: -.01em !important; background: linear-gradient( 135deg, #315cff 0%, #6857ff 100% ) !important; box-shadow: 0 6px 15px rgba(61, 79, 234, .18) !important; } html body .ft-engine-nav-inner > .ft-product-link:hover { color: #ffffff !important; transform: translateY(-1px) !important; box-shadow: 0 8px 19px rgba(61,79,234,.23) !important; } /* ======================================================== ÇALIŞMALARIM / HESABIM ======================================================== */ html body .ft-engine-nav-inner > .ft-header-actions { gap: 5px !important; margin-left: auto !important; padding-left: 12px !important; border-left: 1px solid #dfe3ea !important; } html body .ft-engine-nav-inner .ft-header-button { height: 34px !important; padding: 0 10px !important; gap: 6px !important; border: 1px solid #e0e4eb !important; border-radius: 9px !important; background: #ffffff !important; color: #242c3a !important; font-size: 10.5px !important; line-height: 1 !important; font-weight: 750 !important; letter-spacing: -.01em !important; box-shadow: 0 2px 7px rgba(20,30,50,.025) !important; } html body .ft-engine-nav-inner .ft-header-button > span { color: #273142 !important; font-size: 11px !important; } html body .ft-engine-nav-inner .ft-header-button:hover { color: #315cff !important; background: #f7f8ff !important; border-color: #cdd5f5 !important; transform: translateY(-1px) !important; } /* ======================================================== TOP STATUS BAR Make its text clearer too. ======================================================== */ html body .ft-topbar, html body .ft-system-bar { font-weight: 550 !important; } html body .ft-topbar a, html body .ft-topbar span, html body .ft-system-bar a, html body .ft-system-bar span { opacity: 1 !important; } /* ======================================================== WIDE DESKTOP ======================================================== */ @media (min-width: 1450px) { html body .ft-engine-nav-inner { padding-left: 245px !important; gap: 5px !important; } html body .ft-engine-nav-inner > a:not(.ft-product-link) { padding-left: 8px !important; padding-right: 8px !important; font-size: 12px !important; } html body .ft-engine-nav-inner > .ft-product-link { padding-left: 16px !important; padding-right: 16px !important; font-size: 11.5px !important; } html body .ft-engine-nav-inner .ft-header-button { padding-left: 11px !important; padding-right: 11px !important; font-size: 11px !important; } } /* ======================================================== NORMAL DESKTOP ======================================================== */ @media (min-width: 1250px) and (max-width: 1449px) { html body .ft-engine-nav-inner { padding-left: 225px !important; gap: 2px !important; } html body .ft-engine-nav-inner > a:not(.ft-product-link) { padding-left: 5px !important; padding-right: 5px !important; font-size: 10.5px !important; } html body .ft-engine-nav-inner > .ft-product-link { padding-left: 11px !important; padding-right: 11px !important; font-size: 10.5px !important; } html body .ft-engine-nav-inner .ft-header-button { padding-left: 7px !important; padding-right: 7px !important; font-size: 9.8px !important; } } /* ======================================================== MEDIUM DESKTOP SAFETY ======================================================== */ @media (min-width: 1000px) and (max-width: 1249px) { html body .ft-engine-nav-inner { padding-left: 195px !important; gap: 0 !important; } html body .ft-header-main > .ft-brand .ft-brand-copy small { display: none !important; } html body .ft-engine-nav-inner > a:not(.ft-product-link) { padding-left: 3px !important; padding-right: 3px !important; font-size: 9px !important; } html body .ft-engine-nav-inner > .ft-product-link { padding-left: 8px !important; padding-right: 8px !important; font-size: 9px !important; } html body .ft-engine-nav-inner > .ft-header-actions { padding-left: 5px !important; } html body .ft-engine-nav-inner .ft-header-button { padding-left: 4px !important; padding-right: 4px !important; font-size: 8.5px !important; } } /* ======================================================== SMALL SCREEN FALLBACK ======================================================== */ @media (max-width: 999px) { html body .ft-engine-nav-inner { overflow: visible !important; } }