:root { --headerlogo-background-position: left center; } [dir="rtl"]:root { --headerlogo-background-position: right center; } .pageTitle { vertical-align: middle; margin: 0; -webkit-align-items: center; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pageTitleWithLogo { background-position: left center; background-position: var(--headerlogo-background-position); background-size: contain; background-repeat: no-repeat; width: 10.25em; height: 2em; padding-left: 5em; } @media all and (orientation: portrait) { .pageTitle:not(.pageTitleWithLogo) { font-size: 1.17em; } } .pageTitleWithDefaultLogo { width: 4.7em; } .darkContentContainer .pageTitleWithDefaultLogo { background-image: url(../themes/logowhite.png); } .headerButton { -webkit-flex-shrink: 0; flex-shrink: 0; } @supports selector(:hover) and (display: revert) and (column-gap: 1em) { .headerLeft, .headerRight { -webkit-column-gap: 0.55em; column-gap: 0.55em; } .headerSectionItem { margin: 0 !important; } .headerSelectedPlayer { -webkit-margin-end: -0.5em !important; margin-inline-end: -0.5em !important; } } .pageTitle-marginstart { -webkit-margin-start: 0.5em !important; margin-inline-start: 0.5em !important; } @media all and (display-mode: minimal-ui) { .headerBackButton-showfullscreen { display: none !important; } } .headerUserButtonImage { border-radius: 1000px; } .headroom-hidden.headroom-scrolling .headerSection { visibility: hidden; } .skinHeader { container-type: inline-size; container-name: appheader; } @supports (height: calc(3.125em + 2 * max(3em, 4em))) { .skinHeader { padding-top: max(1.2em, env(safe-area-inset-top, 0)); } } .skinHeader-withnowplaying { padding-top: 0; } @media all and (min-width: 60em) { .headerHomeButton-withdockeddrawer, .headerMenuButton-withdockeddrawer { display: none !important; } .skinHeader-withfulldrawer .pageTitleWithDefaultLogo { display: none; } .skinHeader-withdockeddrawer { -webkit-padding-start: 1.4em; padding-inline-start: 1.4em; } } .appHeader-tv.semiTransparent { text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); } .headerMiddle { overflow: hidden; -webkit-flex-grow: 1; flex-grow: 1; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; margin: 0 auto; } .headerMiddle-tv { margin-top: 0.4em; } .headerMiddle-withSectionTabs { width: 60%; } .headerLeft { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; overflow: hidden; -webkit-padding-start: 0.8em; padding-inline-start: 0.8em; -webkit-flex-grow: 1; flex-grow: 1; max-width: 60%; } .headerRight { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: flex-end; justify-content: flex-end; white-space: nowrap; -webkit-padding-end: 0.85em; padding-inline-end: 0.85em; -webkit-flex-grow: 0; flex-grow: 0; -webkit-margin-start: auto; margin-inline-start: auto; max-width: 40%; } .headerLeft, .headerRight { min-height: 3.127em; box-sizing: border-box; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: auto; flex-basis: auto; } .headerTop-withSectionTabs .headerLeft, .headerTop-withSectionTabs .headerRight { width: 20%; } @media not all and (min-width: 120em) { .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) { -webkit-flex-wrap: wrap; flex-wrap: wrap; } .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerLeft { width: 70%; max-width: initial; } .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerRight { max-width: initial; } .headerMiddle-withSectionTabs:not(.headerMiddle-tv) { -webkit-flex-grow: initial !important; flex-grow: initial !important; -webkit-flex-basis: 100%; flex-basis: 100%; -webkit-order: 3; order: 3; margin-top: 0.75em; width: initial; } } @media (pointer: fine) { .adjustHeaderForEmbeddedScroll { right: 1.08em; inset-inline-start: 0; inset-inline-end: 1.08em; } } .sectionTabs { text-align: center; } .headerClock { margin: 0 0.25em; display: inline-block; vertical-align: middle; font-weight: 600; font-size: 118%; } .headerSelectedPlayer { font-weight: 400; max-width: 10em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .headerHelpButton { color: #42a5f5 !important; } @media not all and (min-width: 37.5em) { .headerLeft { max-width: calc(100% - 20ch); } .headerRight { max-width: 20ch; } .headerSelectedPlayer { display: none; } } .headerTop-tv-withSectionTabs-hideTitle .pageTitle:not(.pageTitleWithDefaultLogo) { display: none !important; } .headerTop-tv-withSectionTabs .headerHelpButton { display: none !important; } @media not all and (min-width: 50em) { .headerSettingsButton { display: none !important; } } .btnHeaderPremiere { -webkit-margin-end: 1em; margin-inline-end: 1em; } @media not all and (min-width: 48em) { .btnHeaderPremiere { display: none !important; } } .tabs-viewmenubar { font-size: 112%; border-radius: 100em; display: -webkit-flex; display: flex; } @media not all and (min-height: 40em), not all and (min-width: 66em) { .withHeaderTabs:not(.layout-tv):root { --extra-padding-top: 1.1em; } .tabs-viewmenubar-backgroundcontainer:not( .tabs-viewmenubar-backgroundcontainer-tv ) { background: 0 0 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } .tabs-viewmenubar-slider:not(.tabs-viewmenubar-slider-tv) { -webkit-padding-start: 1em; padding-inline-start: 1em; -webkit-padding-end: 1em; padding-inline-end: 1em; } } @media all and (min-width: 120em) { .tabs-viewmenubar { font-size: 116%; max-width: 90%; } .headerTop-withSectionTabs .headerLeft { -webkit-flex-grow: 0; flex-grow: 0; } } .headerTop-tv-withSectionTabs .headerLeft { -webkit-flex-grow: 0; flex-grow: 0; } .tabs-viewmenubar-tv { max-width: 90%; font-size: inherit; } @media all and (min-width: 130em) { .tabs-viewmenubar { max-width: 100%; } } .tabs-viewmenubar-slider { padding: 0.25em; background-color: black; } .main-tab-button { padding: 0.25em 1.76ch !important; border-radius: 100em !important; } .headerNowPlaying { -webkit-flex-basis: 100%; flex-basis: 100%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; padding: 0 2ch; padding-top: env(safe-area-inset-top, 0); height: 4em; box-sizing: border-box; margin-bottom: 0.8em; } @supports (height: calc(3.125em + 2 * max(3em, 4em))) { .headerNowPlaying { height: calc(5em + env(safe-area-inset-top, 0)); } } /* test lint comment moment */