/* ============================================================================= TURIZM HEADER — Mobile Premium Polish --------------------------------------------------------------------------- Author note (2026-05-14): Loaded AFTER turizm-theme.css so these rules override the earlier @media (max-width: 768px) blocks in turizm-theme.css for the header. Scope: - Mobile only (max-width: 768px). - Desktop (≥769px) is intentionally left untouched. Changes: 1) Doping Travel logo grows ~18% on mobile — aspect ratio preserved via width:auto + object-fit:contain. Right-side reservation is reduced because the language chip is now flag-only, giving the logo more room without making the header crammed. 2) Language switcher button (mobile): - "EN/TR/RU" text label hidden (display:none) — only the flag is shown. - The dropdown chevron is also hidden for a cleaner minimal chip. - Thin gold border + soft cream background + subtle inner highlight. - Reduced inner padding, slight border-radius — premium feel. - Dropdown behaviour itself is NOT touched (still works on click). 3) User avatar / hamburger sit on the SAME 34px vertical axis as the language chip — they were already centered via flex, but we lock heights so any future style drift can't break alignment. Comments tagged "OLD:" record the previous values from turizm-theme.css so this override is easy to reason about / revert without git history. ============================================================================= */ @media (max-width: 768px) { /* ── Header bar height & padding ────────────────────────────────────── Slight bump so the upsized logo can breathe; small enough that the overall header doesn't look "broken" (kullanıcı isteği: header yüksekliği bozulmasın). Buttons stay 34px tall and remain vertically centered. OLD (turizm-theme.css @768px): min-height: 64px; padding: 8px 12px; */ .bravo_wrap .bravo_header .header-inner.content, .bravo_wrap .bravo_header.site-header .header-inner.content, .bravo_wrap > header.bravo_header.site-header > .header-inner.content, .bravo_wrap > header.bravo_header > .header-inner.content, .bravo_wrap header.bravo_header.site-header > .header-inner.content, .bravo_wrap header.bravo_header > .header-inner.content { min-height: 72px !important; padding: 8px 12px !important; align-items: center !important; } /* ── Logo: ~+18% bigger; aspect ratio preserved ─────────────────────── Width budget bumped because the language chip is now flag-only, so we can safely give back ~30px to the logo. OLD (turizm-theme.css @768px): max-height: 64px; max-width: min(210px, calc(100vw - 168px)); */ .bravo_wrap .header .logo img, .bravo_wrap .navbar-brand img, .bravo_wrap .site-logo img, .bravo_wrap .bravo_header .content .header-left .bravo-logo img, .bravo_wrap header.bravo_header .header-inner .header-left .bravo-logo img { max-height: 76px !important; max-width: min(260px, calc(100vw - 132px)) !important; width: auto !important; height: auto !important; object-fit: contain !important; object-position: left center !important; } .bravo_wrap .bravo_header .content .header-left, .bravo_wrap .bravo_header .header-inner.content .header-left { max-width: min(260px, calc(100vw - 132px)) !important; flex: 1 1 auto !important; min-width: 0 !important; } /* ── Language chip: flag-only, premium thin gold border ──────────────── OLD (turizm-theme.css @768px): gap:5px; padding:0 10px; "EN" + chevron visible. NEW (2026-05-14 v1): gap:0; padding:0 8px; min-width:38px; flag-only @18px. NEW (2026-05-14 v2): square 34×34 chip; padding 0 6px; flag down to 13px (~28% smaller) — minimal, premium, not louder than logo / avatar. */ .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; /* OLD v1: padding: 0 8px; min-width: 38px; */ /* NEW v2: tighter padding + square chip matching avatar/hamburger row. */ padding: 0 6px !important; min-width: 34px !important; width: 34px !important; height: 34px !important; min-height: 34px !important; box-sizing: border-box !important; border-radius: 9px !important; border: 1px solid rgba(201, 162, 39, 0.55) !important; background: rgba(255, 252, 245, 0.96) !important; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 1px 2px rgba(17, 24, 39, 0.05) !important; line-height: 1 !important; margin: 0 !important; } /* Hover/focus: keep the same compact size, just a stronger gold edge. */ .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login:hover, .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login:focus { border-color: rgba(201, 162, 39, 0.85) !important; background: rgba(255, 252, 245, 1) !important; } /* Hide the locale text ("EN"/"TR"/...) and the dropdown chevron on mobile. Markup is kept (switcher.blade.php untouched) so desktop still shows the code + caret, and the dropdown system itself keeps working. */ .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login .turizm-lang-code, .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login .turizm-lang-chevron { display: none !important; } /* ── Flag icon: shrunk ~28% so it doesn't dominate logo / avatar ────── flag-icon library uses font-size to scale: width = 1.333em, height = 1em (4:3 aspect). At 13px → flag renders ~17×13px inside a 34×34 chip, leaving ~8px breathing room each side. Centered both axes via flex. OLD v1: font-size: 18px; (≈ 24×18 flag — too dominant) */ .bravo_wrap .bravo_header .content .header-right .turizm-header-lang .turizm-header-lang-toggle.is_login .flag-icon { margin: 0 !important; font-size: 13px !important; line-height: 1 !important; width: 1.333em !important; height: 1em !important; flex-shrink: 0 !important; box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.06) !important; border-radius: 2px !important; background-position: 50% 50% !important; } /* ── Vertical alignment: avatar / login / hamburger share the same 34px center line as the language chip ──────────────────────────────── */ .bravo_wrap .bravo_header .content .header-actions.header-right, .bravo_wrap .bravo_header .content .header-right .topbar-items { align-items: center !important; } .bravo_wrap .bravo_header .content .header-right .bravo-more-menu { height: 34px !important; min-height: 34px !important; line-height: 1 !important; padding: 0 8px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } /* ───────────────────────────────────────────────────────────────────── Mobile drawer (hamburger menu) — hide section title headings ───────────────────────────────────────────────────────────────────── Kullanıcı isteği: drawer içindeki "ACCOUNT" ve "PREFERENCES" başlık yazıları görsel olarak kalksın; Login/Sign Up butonları, Currency ve Language seçicileri AYNEN çalışmaya devam etsin. Markup'a dokunulmuyor:

hâlâ DOM'da, çünkü
bunlara referans veriyor (ekran okuyucuların doğru bölüm adını okuması için). Bu yüzden display:none yerine "visually hidden" (sr-only) deseni kullanıyoruz — ekran okuyucu okumaya devam eder, ekranda 0 yer kaplar. Spacing dengesi: başlıkların kapladığı dikey alan (≈ 22px) yok olunca üst boşluk biraz arttırılıyor (section padding-top 16 → 20px) ki Login/Sign Up ve switcher kartları yapışık görünmesin. OLD (turizm-theme.css): .turizm-drawer-section { padding: 16px 18px 0; } .turizm-drawer-section-title { display: block; margin: 0 0 10px; } */ .bravo_wrap .bravo_header .bravo-menu-mobile .turizm-drawer-section-title { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } /* Title artık görünmediğinden bölümlerin üst boşluğunu hafif arttır (16px → 20px). Tasarım dengeli kalır, alttaki kart/butonlar yapışmaz. */ .bravo_wrap .bravo_header .bravo-menu-mobile .turizm-drawer-section--account, .bravo_wrap .bravo_header .bravo-menu-mobile .turizm-drawer-section--preferences { padding-top: 20px !important; } } /* ============================================================================= END — Mobile Premium Polish ============================================================================= */