/* https://www.flaticon.com/packs/international-flags */

/* 
--
-- switch lang 
-------------------------------------------------------------------------------------------------------
*/

/*
--
-- in the following 
--
-- lang-active : from player automatic selection (type audio or captions)
-- user-selected : the user selected item (user interaction)
-- lang-default : the page language (page setup)
-- lang-selected : user|default
-- lang-main : page default (site lang), type manifest or link
-- lang-manifest-matching : type manifest, matching player current manifest
--
*/

.lang-switch{
  --color-bg:#00000088;
  --color-bd:#ffffff;
  --color-label:#ffffff;
  --color-cta-bg:#ffffff;
  --color-cta-label:#000;
  --color-disabled:#333333;
  --color-matching:#00000088;
  --color-selected:#000000;
  --color-selected-bg:#ffffff;
  --color-disabled-bg:#ffffff;
  --btn-size:22px;
  --btn-expanded-size:44px;
  --btn-bg-size:23px;
}

.spacer {
  visibility: hidden !important;
}

.lang-switch.lang-mono .lang-item,
.lang-item.lang-selected,
.lang-item.lang-active,
.lang-item.user-selected,
.lang-item.lang-default {
  cursor: initial;
}
.lang-item.lang-type-captions,
.lang-item.link,/*.link:@deprecated*/
.lang-item {
  cursor: pointer;
}

.lang-item.lang-disabled{
  cursor: initial !important;
}

#header.noLogo .wrap {
  margin-right: 0;
}

.header-text { /*switch-lang container*/
  position: relative;
}

/* 
-- 
-- z-index 
-- 
*/

body.lang-switch-position-page-header #header {
  z-index: 1;
}

.lang-switch {
  z-index: 20000;
}
.instantShare {
  z-index: 20001;
}
.lang-expanded.lang-switch {
  z-index: 30000;
}

.lang-item {
  z-index: 10000;
}

.lang-switch:not(.user-selection) .lang-item.lang-default,
.lang-item.lang-selected {
  z-index: 10001;
}
.lang-item.user-selected {
  z-index: 10002;
}
.lang-item:hover {
  z-index: 10003;
}
.lang-switch.lang-expanded .lang-item.lang-selected,
.lang-switch:hover .lang-item.lang-selected {
  z-index: 9999;
}

/* 
-- header - flex 
------------------------------------------------------------------- 
*/

body.lang-switch-position-page-header #header .header-logo,
body.lang-switch-position-page-header #header .header-text,
body.lang-switch-position-page-header #header .wrap,
body.lang-switch-position-page-header #header {
  display: flex;
  box-sizing: border-box;
  justify-content: center;
  align-content: center;
  align-items: center;
}

body.lang-switch-position-page-header #header .wrap {
  justify-content: space-between;
}

body.lang-switch-position-page-header #header .header-logo {
  min-width: 10%;
  margin-right: 10px;
}

body.lang-switch-position-page-header #header .header-text {
  padding-right: 100px;
  height: 100%;
  width: auto;
}

body.lang-switch-position-page-header #header .header-title {
  width: 100%;
  line-height: 1.2em;
}

/* 
--
-- lang-modal
--
*/

.lang-modal {
  display: none;
  background: rgba(0, 0, 0, .5);
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.lang-modal-close {
  display: none;
}

.lang-expanded .lang-modal-close {
  text-align: center;
  display: inline-block;
  width: 44px;
  height: 44px;
}

/*** modal is invisible ***/
.lang-expanded .lang-modal {
  opacity: 0;
}

.lang-expanded .lang-modal-close {
  display: none;
}

.lang-expanded .lang-modal-close::after {
  content: "x";
  font-family: monospace;
  color: #ffffff;
  font-size: 14px;
  margin: 50% 2px 0 auto;
  display: inline-block;
  transform: translate(0, -50%);
}

.lang-expanded .lang-modal {
  display: inline-block;
}


/* 
--
-- list containers
--
*/

.lang-list-container {
  display: inline-block;
  height: 100%;
  width: 100%;
}

.lang-list-container .wrapper {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  width: 100%;
}

.lang-list {
  width: 100%;
  display: inline-block;
  position: relative;
  overflow: visible;
  /* required for lang-text not to move up on hover */
  min-height: 30px;
  height: 30px;
}

.lang-list-flag-wrapper {
  margin: auto;
  position: relative;
  height: 26px; /*.lang-flag:height*/
  width: 26px; /*.lang-flag:width*/
}


/* 
--
-- header-lang-switch
--
*/

#header .header-lang-switch {
  display: inline-block;
  position: relative;
  text-align: center;
  vertical-align: middle;
}

body.lang-switch-position-page-header #header .header-lang-switch {
  position: fixed;
  top: 0;
  width: 60px;
  right: 1%;
}

@media only screen and (min-width: 1580px) {
  body.lang-switch-position-page-header #header .header-lang-switch {
    right: calc(50% - 790px);
  }
}

@media only screen and (max-width: 799px) {
  body.lang-switch-position-page-header #header .header-lang-switch {
    right: 0;
  }
}


/* 
--
-- lang-switch
--
*/

.lang-switch {
  border-radius: 4px;

  width: 50px;
  display: inline-block;
  text-align: center;
  
  user-select: none;
}


body.lang-switch-position-player-bottom .lang-switch,
body.lang-switch-position-player-bottom #container #elementsBottomPlayer #switchLang.lang-switch {
  position: absolute;
  width: auto;
  transform: none;
  text-align: right;
  margin: 4px 0;

  top: 4px;
  bottom: auto;
  right: 0px;
  left: auto;
}

body.lang-switch-position-player-top .lang-switch {
  position: absolute;
  transform: none;
  text-align: right;
  margin: 4px 1px;

  top: 2px;
  bottom: auto;
  right: 2px;
  left: auto;

  width: 55px;
}

body.lang-switch-position-page-header .lang-switch {
  padding-top: 10px;
}


/* 
-- 
-- lang-list-flags appearance/disappearance 
--
*/

/*
--
-- lang-item
--
*/

.lang-item {
  border-radius: 50%;
  margin: 1px;
  font-size: 13px;
}

.lang-list-items .lang-item {
  transition: opacity .5s ease-out;
  opacity: 0;
  float: right;
  overflow: visible;
}

body.lang-switch-position-page-header .lang-item{
  opacity: 0;
}
body.lang-switch-position-player-top .lang-item {
  opacity: 0.25;
}

.lang-switch.lang-expanded .lang-item,
.lang-switch:hover .lang-item {
  opacity: 1;
}

.lang-switch .lang-item.lang-selected {
  opacity: 1;
}

body.lang-switch-position-page-header .lang-switch:not(.user-selection) .lang-item.lang-default,
body.lang-switch-position-player-top  .lang-switch:not(.user-selection) .lang-item.lang-default{
  opacity: 1;
}

/*body.lang-switch-position-player-top .lang-switch .lang-item.lang-selected,*/
/*
body.lang-switch-position-player-top .lang-switch .lang-item.user-selected {
  position: absolute;
  right: 0;
}
*/

body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item,
body.lang-switch-position-player-top  .lang-switch.lang-multi.lang-expanded .lang-item,
body.lang-switch-position-player-top:not(.device-touch-support) .lang-switch.lang-multi:hover .lang-item {
  position: relative;
}

/*
body.lang-switch-position-player-top .lang-switch:hover .lang-item {
  position: absolute;
  top: 0;
  left: 0;
}
*/
/*
body.lang-switch-position-page-header.x-scrolled .lang-list-items .lang-item {
  float: left;
}
*/

x-body.lang-switch-position-page-header .lang-switch.lang-multi:not(.user-selection) .lang-item.lang-default,
x-body.lang-switch-position-page-header .lang-switch.lang-multi.user-selection .lang-item.user-selected {
  order:-1 !important;
}

body.lang-switch-position-page-header .lang-switch:not(.user-selection) .lang-item.lang-default,
body.lang-switch-position-page-header .lang-switch.user-selection .lang-item.user-selected{
  order:-1 !important;
}


body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item:not(.user-selected) {
  position: absolute;
  top: 0;
  left: 0;
}


body.lang-switch-position-player-bottom .lang-switch:not(.lang-multi) .lang-item:not(.lang-selected) {
  opacity: .5;
}

body.lang-switch-position-player-bottom .lang-switch:not(.lang-multi) .lang-item:hover,
body.lang-switch-position-player-bottom .lang-switch.lang-multi .lang-list-items .lang-item {
  opacity: 1;
}


/* 
-- 
-- lang-list-items 
--
*/

.lang-list-items {
  position: absolute;
  top: 0;
  display: inline-block;
  border-radius: 4px;
  overflow: visible;
}

.lang-list-items {
  height: 26px;
  width: 26px;
}

.lang-list-items {
  opacity: 1;
}

.lang-switch.lang-multi:not(.lang-switch-set-width-done) .lang-list-items {
  opacity: 0;
}

.lang-list-items {
  left: auto;
  right: 0px; /* -(.lang-list  margin) */
}

/* 
-- 
-- lang-img 
--
*/

.lang-img {
  border-radius: 50%;
  border: 1px solid;
  position: relative;
  background: no-repeat center;

  width: var(--btn-size);
  height: var(--btn-size);
  background-size: var(--btn-bg-size) var(--btn-bg-size);

  display: flex;
  justify-content: center;
  align-items: center;
}

.lang-item .lang-img {
  color:var(--color-label);
  border-color: var(--color-bd);
  background-color: var(--color-bg);
}

.lang-item.lang-selected .lang-img,
.lang-item.lang-active .lang-img {
  color:var(--color-selected);
  background-color: var(--color-selected-bg);
}

.lang-item.lang-manifest-matching .lang-img,
.lang-item.lang-active .lang-img,
.lang-item.lang-selected .lang-img {
  border-width: 1px;
}
.lang-item.lang-active .lang-img,
.lang-item.lang-manifest-matching .lang-img {
  border-color: var(--color-matching);
  border-style: dashed;
}
.lang-item.lang-selected .lang-img {
  border-color: var(--color-selected);
  border-style: solid;
}

.lang-alt {
  display: block;
  /*line-height: var(--btn-size);*/
  text-align: center;
  vertical-align: middle;
  margin-top: 1px;
  margin-left: 1px;
}
.lang-item.use-img .lang-alt {
  display: none;  
}

.lang-expanded .lang-img {
  width: var(--btn-expanded-size);
  height: var(--btn-expanded-size);
  background-size: cover;
}
.lang-expanded .lang-alt {
  line-height: var(--btn-expanded-size);
}

.lang-list-items .lang-item:hover .lang-igm,
.lang-list-items .lang-item.lang-selected .lang-img {
  opacity: 1;
}

.lang-switch.lang-multi .lang-list-items .lang-item .lang-img {
  opacity: .5;
}

.lang-switch.lang-multi .lang-list-items .lang-item:hover .lang-img,
.lang-switch.lang-multi .lang-list-items .lang-item.lang-selected .lang-img {
  opacity: 1;
}

.lang-item[data-lang-target]:not(.lang-selected):hover .lang-img {
  transform: scale(1.1);
}

.lang-item.lang-action-player:not(.lang-type-captions).lang-selected .lang-img{
  transform: scale(1) rotate(360deg);
  transition: transform 1s;
}


/*
--
-- lang-disabled
--
*/

.lang-item.lang-disabled .lang-img{
  background-color: var(--color-disabled-bg);
  color:var(--color-disabled);
  opacity: .25 !important;
}

/*
------------------------------------------------------------------------------------------------------------------------
--
-- switch lang flex (general)
--
------------------------------------------------------------------------------------------------------------------------
*/

.lang-switch,
.lang-list-flag,
.lang-list-flag-wrapper,
.lang-list-items{
  display: flex;
}

.lang-switch,
.lang-list-flag,
.lang-list-flag-wrapper,
.lang-list-items,
.lang-item {
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}



#container #elementsBottomPlayer #switchLang,
.lang-list-flag-wrapper,
.lang-list-items {
  height: auto;
}

.lang-list-flag-wrapper {
  width: auto !important;
  position: relative;
}

.lang-list-items {
  width: auto !important;
  position: relative;
}

.lang-list-text.spacer {
  display: none;
}

.lang-list-items .lang-item {
  margin: 0;
  padding: 1px;
  border-radius: 0;
}


/*
------------------------------------------------------------------------------------------------------------------------
*/


body.lang-switch-position-player-top .lang-switch.lang-multi:hover .lang-item.lang-selected .lang-img::before {
  content: none;
}

body.lang-switch-position-player-top .lang-switch.lang-multi .lang-list-items .lang-item .lang-img,
body.lang-switch-position-player-top .lang-switch.lang-multi:hover .lang-img {
  opacity: 1;
}


body.lang-switch-position-page-header.x-scrolled .lang-switch:hover .lang-list-img {
  position: absolute;
  bottom: 2px; /*lang-switch:bottom*/
  top: auto;
  width: 50px;
}

body.lang-switch-position-page-header.x-scrolled .lang-list-items {
  left: 0px; /* -(.lang-list  margin) */
  right: auto;
}

body.lang-switch-position-page-header .lang-switch.lang-multi .lang-list-items {
  /*202508*//*padding-top: 26px;*/
}

body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-list-items {
  padding-top: 0;
}

body.lang-switch-position-page-header .lang-switch .lang-list-items {
  background-color: transparent;
}

body.lang-switch-position-page-header .lang-list-items {
  max-width: 26px;
}

body.lang-switch-position-page-header.x-scrolled .lang-list-items {
  max-width: none;
}

body.lang-switch-position-page-header .lang-switch:hover .lang-list-items {
  height: auto;
}

body.lang-switch-position-page-header .lang-switch.lang-multi .lang-list-items .lang-item .lang-img {
  opacity: 1;
}


body.lang-switch-position-page-header.x-scrolled .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before {
  content: "\25E2";
  left: auto;
  right: -4px;
  top: auto;
  bottom: -4px;
  line-height: 1em;
}

body.lang-switch-position-page-header .lang-switch.lang-multi:hover .lang-item.lang-selected .lang-img::before {
  opacity: 0;
}




/*
-- 
-- header lang-switch position (see @media) 
--
*/

.header-title {
  width: 100%;
}



.lang-switch.lang-horizontal:not(.lang-switch-set-width-done) {

}


body.lang-switch-position-page-header .header-title {
  width: 79%;
}


body.lang-switch-position-page-header .lang-switch:hover .lang-list {
  height: auto;
}


/* 
--
-- lang-switch - player-bottom 
--
*/

.instantShare {
  min-width: 100px;
  width: auto;
}

#container #elementsBottomPlayer #InstantShareAction {
  height: calc(100% - 10px);
  margin-top: 0;
  padding: 0 2px 4px 0;
}

#InstantShareAction .currentTime {
  display: inline-block;
}

body.lang-switch-position-player-bottom #container #elementsBottomPlayer #switchLang.lang-switch,
body.lang-switch-position-player-bottom .lang-list-flag-wrapper,
body.lang-switch-position-player-bottom .lang-list-items {
  width: auto;
}

body.lang-switch-position-player-bottom .lang-list {
  width: auto;
}


/* 
--
-- lang-switch - player-top
--
*/


body.lang-switch-position-player-top  .lang-switch.lang-multi:not(.user-selection) .lang-item.lang-default .lang-img::before,
body.lang-switch-position-page-header .lang-switch.lang-multi:not(.user-selection) .lang-item.lang-default .lang-img::before,
body.lang-switch-position-player-top  .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before, 
body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before {
  position: absolute;
  color:var(--color-selected);
}

body.lang-switch-position-player-top  .lang-switch.lang-multi:not(.user-selection) .lang-item.lang-default .lang-img::before,
body.lang-switch-position-page-header .lang-switch.lang-multi:not(.user-selection) .lang-item.lang-default .lang-img::before,
body.lang-switch-position-player-top  .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before,
body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before {
  font-size: x-small;
  content: "\25E3";
  right: auto;
  left: -4px;
  top: auto;
  bottom: -4px;
  line-height: 1em;
}
body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item.lang-selected .lang-img::before {
  opacity: 1;
  transition: opacity .5s;
}
body.lang-switch-position-page-header.x-scrolled .lang-switch.lang-multi:hover .lang-item.lang-selected .lang-img::before {
  opacity: 0;
}


body.lang-switch-position-player-top .lang-expanded.lang-horizontal .lang-list-items {
  max-width: none;
  width: 100vw !important;
  height: auto;
}

body.lang-switch-position-player-bottom .lang-expanded.lang-horizontal .lang-list-items {
  max-width: none;
  width: 100vw !important;
  height: auto;
  bottom: 0;
  top: auto;
}

body.lang-switch-position-page-header .lang-expanded .lang-list-items {
  max-width: none;
  width: 100vw !important;
  height: auto;
  text-align: left;
}

/**********************************************************************************************************************/
/** @media queries < 800 px **/
/**********************************************************************************************************************/

@media only screen and (max-width: 430px) {
  #header .header-text .subtitle,
  #header .header-text .title {
    font-size: small;
  }
}


/*
------------------------------------------------------------------------------------------------------------------------
--
-- switch lang flex (position-player-bottom)
--
------------------------------------------------------------------------------------------------------------------------
*/

body.lang-switch-position-player-bottom  .lang-list-items {
  justify-content: flex-end;
}





/*
-- switch lang flex (position-player-top)
*/

body.lang-switch-position-player-top .lang-switch {
  justify-content: flex-end;
  width: auto;
  right: 20px;
  top: 10px
}

body.lang-switch-position-player-top  .lang-list-items {
  justify-content: flex-end;
}


body.lang-switch-position-player-top .lang-switch .lang-item {
  position: absolute;
  top: 0;
  right: 0;
}

body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item.lang-selected,
body.lang-switch-position-player-top .lang-switch .lang-item,
body.lang-switch-position-player-top .lang-switch:hover .lang-item {
  left: auto;
}

body.lang-switch-position-player-top .lang-switch .lang-item:not(.lang-type-captions).lang-selected {
  order: 100 !important;
}




/*
-- switch lang flex (position-page-header )
*/

body.lang-switch-position-page-header .lang-switch.lang-multi .lang-list-items {
  flex-direction: column;
}
body.lang-switch-position-page-header .lang-switch.lang-multi.lang-expanded .lang-list-items {
  padding-top: 0;
}


body.lang-switch-position-page-header .lang-switch.lang-multi:not(:hover) .lang-item:not(.lang-selected) {
  position: absolute;
  opacity: 0;
}
body.lang-switch-position-page-header .lang-switch.lang-multi:not(:hover) .lang-item.lang-selected {
  position: relative;
  order: -1 !important;
}

body.lang-switch-position-page-header .lang-switch.lang-multi.lang-expanded .lang-item {
  position: relative;
}




/*
-- switch lang flex (position-bottom )
*/

body.lang-switch-position-player-bottom #container #elementsBottomPlayer #switchLang.lang-switch.lang-expanded,
body.lang-switch-position-player-bottom .lang-switch.lang-expanded {
  top: auto;
  bottom: 0;
}



/*
--
-- player-ready
-- depends on live-frame-state-*
*/

body:not(.live-frame-state-live):not(.live-frame-state-replay) .lang-action-player,
.lang-switch:not(.player-ready) .lang-action-player{
  display: none;
}


/*
-- 
-- lang-item display
--
*/

.lang-item {
  display: flex;
}

/*.lang-switch.lang-collapsable:not(.lang-multi) .lang-item.lang-disabled,*/
.lang-item.lang-disabled{
  display: none;
}

/*
-- 
-- lang-text 
--
*/

.lang-list-items .lang-item:hover.lang-active .lang-text,
.lang-list-items .lang-item:hover.lang-selected .lang-text,
.lang-list-items .lang-item .lang-text,
.lang-list-items:hover .lang-item.lang-active .lang-text,
.lang-list-items:hover .lang-item.lang-selected .lang-text,
.lang-list-items:hover .lang-item .lang-text,
.lang-item.lang-selected:hover .lang-text {
  opacity: inherit;
}

.lang-list-items:not(:hover) .lang-item.lang-selected .lang-text,
.lang-list-items .lang-item:hover.lang-selected .lang-text,
.lang-list-items .lang-item:hover .lang-text {
  opacity: 1;
}

.lang-text {
  opacity: 0;
}
.lang-disabled .lang-text{
  opacity: 0 !important;
}

.lang-switch:not(.lang-multi) .lang-list-items .lang-text,
.lang-switch:not(.lang-multi) .lang-list-items {
  opacity: 1;
}

.lang-switch:not(.lang-multi) .lang-item.lang-selected:hover .lang-text,
.lang-switch:not(.lang-multi) .lang-item.lang-selected .lang-text,
.lang-switch:not(.lang-multi) .lang-list-items:hover .lang-item.lang-selected .lang-text,
.lang-switch:not(.lang-multi) .lang-list-items:hover .lang-text,
.lang-switch:not(.lang-multi) .lang-list-items .lang-text {
  opacity: 0;
}

.lang-switch.lang-mono .lang-list-items:hover .lang-item.lang-selected .lang-text,
.lang-switch:not(.lang-multi) .lang-item:hover .lang-text {
  opacity: 1;
}

.lang-switch:hover .lang-item:hover .lang-text, /* .lang-item:hover .lang-text, wouldn't suffice, opacity 1 would apply on all .lang-item on .lang-list-flags:hover despise .lang-text opacity 0 */
.lang-item.lang-selected .lang-text {
  opacity: 1;
}

body.lang-switch-position-player-top .lang-item.lang-selected .lang-text {
  opacity: 0;
}

.lang-item.lang-selected:hover .lang-text,
.lang-item.lang-selected .lang-text {
  opacity: 0;
}

.lang-list-items:hover .lang-item.lang-selected .lang-text {
  opacity: 1;
}

body.lang-switch-position-player-top .lang-switch:not(.lang-multi):hover .lang-item:not(.lang-selected) .lang-text {
  opacity: 1;
}

body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item.lang-selected .lang-text {
  opacity: 1;
}

body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item:not(.lang-selected) .lang-text {
  opacity: 1;
}

body.lang-switch-position-page-header .lang-switch.lang-multi:hover .lang-item .lang-text {
  opacity: 0;
}

body.lang-switch-position-page-header .lang-switch.lang-multi:hover .lang-item:hover .lang-text {
  opacity: .9;
}



body.lang-switch-position-page-header .lang-item .lang-text {
  border: 1px solid;
}
/*
body.lang-switch-position-page-header .lang-item.lang-selected .lang-text {
  border: none;
}
*/
body.lang-switch-position-page-header .lang-switch .lang-item .lang-text {
  position: absolute;
  min-width: 50px;
  transform: translate(0, -50%);
  top: 50%;
  padding: 3px 8px;
  left: auto;
  right: 100%;
  opacity: .9;
}

body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item .lang-text {
  position: absolute;
  min-width: 50px;
  transform: translate(-50%, 0);
  left: 50%;
  top: 100%;
  padding: 8px 1px 4px 1px; /* must be padding, with margin, lang-flag and lang-text are separated by the margin that breaks the :hover of /* lang-list-flags appearance/disappearance */
}

body.lang-switch-position-player-bottom .lang-switch:not(.lang-multi) .lang-text,
body.lang-switch-position-player-bottom .lang-selected .lang-text {
  position: absolute;
  top: auto;
  bottom: 0;
  right: 100%;
  left: auto;
}


body.lang-switch-position-player-bottom .lang-switch:not(.lang-multi) .lang-text {
  float: left;
  margin: 4px;
  padding: 4px;
  font-size: small;
  width: 130px;
}

body.lang-switch-position-player-bottom .lang-selected .lang-text {
  margin: 0;
  width: 200px;
  padding-right: 8px;
  font-size: small;
}



body.lang-switch-position-player-top .lang-switch:hover .lang-item .lang-text {
  position: absolute;
  min-width: 55px;
  transform: translate(-50%, 0);
  left: 50%;
  top: 100%;
  padding: 8px 1px 4px 1px; /* must be padding, with margin, lang-flag and lang-text are separated by the margin that breaks the :hover of /* lang-list-flags appearance/disappearance */
  border: 1px solid var(--color-cta-label);
  text-align: center;
}

body.lang-switch-position-player-top .lang-item.lang-selected .lang-text {
  border: none;
}

.lang-list-text,
.lang-text {
  font-size: x-small;
  border-radius: 4px;
  padding: 8px 1px 8px 1px;
}

.lang-active .lang-text,
.lang-selected .lang-text,
.lang-text {
  color:var(--color-cta-label);
  background-color: var(--color-cta-bg);
}



body.lang-switch-position-player-top .lang-switch .lang-item .lang-text {
  opacity: 0;
}


body.lang-switch-position-player-bottom .lang-text {
  position: absolute;
  top: auto;
  bottom: 0;
  left: auto;
  right: calc(100% + 1em);
  width: 15em;
}

body.lang-switch-position-player-bottom .lang-item .lang-text {
  visibility: hidden;
}

body.lang-switch-position-player-bottom .lang-item:hover .lang-text {
  visibility: visible;
}

/*
-- 
-- lang-text display
--
*/

.lang-switch.device-touch-support .lang-text{
  /* non CTA text on touch device (no :hover state's associated events) */
  display: none !important;
}

.lang-item:hover.lang-active .lang-text,
.lang-item:hover.lang-selected .lang-text {
  display: none;
}

.lang-item:hover.lang-type-captions .lang-text {
  display: flex;
}


/*------------------*/
body.lang-switch-position-page-header .lang-text {
  display: none;
}
body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item.lang-selected .lang-text,
x-body.lang-switch-position-player-top  .lang-item:hover:not(.lang-disabled) .lang-text,
x-body.lang-switch-position-page-header .lang-item:hover:not(.lang-disabled) .lang-text,
body:not(.lang-switch-position-page-bottom) .lang-item:hover:not(.lang-disabled) .lang-text{
  display: inline-block;
}
x-body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item:hover .lang-text,
x-body.lang-switch-position-page-header .lang-switch .lang-item .lang-text {
  display: inline-block;
}
xx-body.lang-switch-position-page-header .lang-switch:hover .lang-item .lang-text,
x-body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item .lang-text,
x-body.lang-switch-position-page-header .lang-switch            .lang-item.lang-selected .lang-text,
x-body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item:hover.lang-selected .lang-text {
  display: none;
}
/*------------------*/


/*=========================* /
body.lang-switch-position-page-header .lang-switch .lang-item .lang-text,
body.lang-switch-position-page-header .lang-switch:hover .lang-item .lang-text,
body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item:hover.lang-selected .lang-text {
  display: none;
}
body.lang-switch-position-page-header .lang-switch:not(.lang-multi) .lang-item:not(.lang-selected) .lang-text,
body.lang-switch-position-page-header .lang-switch.lang-multi .lang-item:hover .lang-text {
  display: inline-block;
}
body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item:hover .lang-text,
body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item .lang-text {
  display: none;
}
/*=========================*/



x-body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item:hover .lang-text,
x-body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item .lang-text {
  display: none;
}


body.lang-switch-position-player-bottom .lang-text {
  display: none;
}
body.lang-switch-position-player-bottom .lang-switch:not(.lang-multi) .lang-text,
body.lang-switch-position-player-bottom .lang-selected .lang-text {
  display: inline-block;
}
x-body.lang-switch-position-player-top  .lang-switch:hover .lang-item.lang-selected .lang-text,
x-body.lang-switch-position-player-top  .lang-switch .lang-item .lang-text,
body.lang-switch-position-player-top .lang-item .lang-text{
  display: none;
}

.lang-switch.lang-expanded .lang-item .lang-text {
  display: none;
}

body.lang-switch-position-player-bottom .lang-switch:hover .lang-item.lang-selected .lang-text {
  display: inline-block;
}
body.lang-switch-position-player-bottom .lang-switch:hover .lang-item.lang-selected:hover .lang-text,
body.lang-switch-position-player-bottom .lang-switch .lang-item.lang-selected .lang-text {
  display: none;
}
/*
body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item:hover .lang-text,
body.lang-switch-position-page-header .lang-switch.lang-expanded .lang-item .lang-text,
*/
body.lang-switch-position-player-top .lang-switch.lang-expanded .lang-item .lang-text,
body.lang-switch-position-player-bottom .lang-switch.lang-expanded .lang-item .lang-text {
  display: none;
}
/*
body.lang-switch-position-player-top .lang-switch:hover .lang-item .lang-text {
  display: inline-block;
}
*/
body.lang-switch-position-player-bottom .lang-text,
body.lang-switch-position-player-bottom .lang-switch:hover .lang-item.lang-selected .lang-text,
body.lang-switch-position-player-bottom .lang-item:hover .lang-text{
  display: inline-block;
}