/** * Jednotné FlekMatch logo = 1:1 s úvodkou (Montserrat, mark 48px, gap 10px). * App chrome: [logo] [zvonek]. Profilová fotka zatím skrytá (vrátíme později). * Montserrat se nenačítá zde — stránky už mají fonts link v (PSI: žádný @import CSS). */ /* --- Dočasně: schovat avatar u brandu (sidebar + mobilní topbar) --- */ .sidebar-brand-row .sidebar-profile-link, .mobile-topbar-brand-wrap .sidebar-profile-link { display: none !important; } /* --- Kontejner = landing .logo-container --- */ .logo-container, .sidebar-brand, .mobile-topbar-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; cursor: pointer; font-family: inherit; background: transparent !important; border: none !important; box-shadow: none !important; padding: 0; margin: 0; color: inherit; transition: opacity 0.18s ease; max-width: 100%; min-width: 0; } .logo-container:hover, .logo-container:focus-visible, .sidebar-brand:hover, .sidebar-brand:focus-visible, .mobile-topbar-brand:hover, .mobile-topbar-brand:focus-visible { opacity: 0.9; outline: none; } /* --- Mark (domeček) — stejné rozměry jako flekmatch-landing.css --- */ .logo-mark, .sidebar-brand-mark, .sidebar-brand-icon, .mobile-topbar-brand .sidebar-brand-mark { display: block; height: 48px; width: auto; max-width: 52px; object-fit: contain; flex-shrink: 0; border-radius: 0; background: transparent !important; box-shadow: none; } /* --- Wordmark — Montserrat 1.5rem, Flek 800 / Match 500 --- */ .logo-text, .sidebar-brand-wordmark, .mobile-topbar-brand .sidebar-brand-wordmark { display: inline-flex; align-items: baseline; font-family: "Montserrat", "Poppins", var(--font-sans, "Plus Jakarta Sans"), sans-serif; font-size: 1.5rem; letter-spacing: -0.04em; line-height: 1; white-space: nowrap; min-width: 0; } .logo-flek, .sidebar-brand-flek, .mobile-topbar-brand .sidebar-brand-flek { color: var(--fm-indigo, var(--color-primary-indigo, #3A2E7A)); font-weight: 800; } .logo-match, .sidebar-brand-match, .mobile-topbar-brand .sidebar-brand-match { color: var(--fm-teal, var(--color-primary-teal, #4CE0C3)); font-weight: 500; } /** * Indigo sidebar / topbar — lavender Flek (jako dark landing), teal Match. * Layout: logo + zvonek vedle sebe (bez avataru). */ aside.sidebar > a.sidebar-brand, .sidebar-brand-row .sidebar-brand { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 0 1.1rem !important; border-radius: 0; } .sidebar-brand-row { display: flex !important; align-items: center; justify-content: flex-start; gap: 0.65rem; width: 100%; box-sizing: border-box; flex: 0 0 auto; padding: 0 0 1.25rem; margin: 0 0 1.1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.22); grid-template-columns: none !important; } .sidebar-brand-row .sidebar-brand { margin: 0 !important; flex: 0 1 auto; max-width: calc(100% - 3rem); } .sidebar-brand-row .notif-bell-btn { flex: 0 0 auto; margin-left: 0 !important; } aside.sidebar > a.sidebar-brand .sidebar-brand-flek, .sidebar-brand-row .sidebar-brand-flek, .mobile-topbar-brand .sidebar-brand-flek, aside.sidebar .sidebar-brand-flek { /* Screen 1: lavender Flek na indigo sidebaru (nepřepisovat inline bílou) */ color: #c4b5fd !important; } aside.sidebar > a.sidebar-brand .sidebar-brand-match, .sidebar-brand-row .sidebar-brand-match, .mobile-topbar-brand .sidebar-brand-match, aside.sidebar .sidebar-brand-match { /* Screen 1: teal Match */ color: var(--color-primary-teal, #4CE0C3) !important; } aside.sidebar .sidebar-brand-wordmark, .sidebar-brand-row .sidebar-brand-wordmark { /* Wordmark nesmí zdědit bílou z inline stylu sidebar-brand */ color: inherit; } /** * Mobilní topbar wrap: [logo jako landing] [zvonek] */ .mobile-topbar-brand-wrap { display: flex !important; align-items: center; justify-content: flex-start; gap: 0.55rem; flex: 1 1 auto; min-width: 0; width: 100%; max-width: 100%; } .mobile-topbar-brand-wrap .notif-bell-btn { flex: 0 0 auto; } .mobile-topbar-brand-wrap .mobile-topbar-brand, .mobile-topbar .mobile-topbar-brand { flex: 0 1 auto; min-width: 0; width: auto !important; max-width: calc(100% - 2.75rem); margin: 0 !important; justify-content: flex-start; gap: 8px !important; overflow: visible !important; } @media (max-width: 767.98px) { /* Stejné jako landing mobile chrome */ .logo-text, .sidebar-brand-wordmark, .mobile-topbar-brand .sidebar-brand-wordmark { font-size: 1.2rem; } .logo-mark, .sidebar-brand-mark, .sidebar-brand-icon, .mobile-topbar-brand .sidebar-brand-mark { height: 40px; max-width: 44px; } .logo-container, .sidebar-brand, .mobile-topbar-brand { gap: 8px; } aside.sidebar > a.sidebar-brand { margin-bottom: 0.85rem !important; } .sidebar-brand-row { margin-bottom: 0.85rem; padding-bottom: 1rem; } }