/* Player-specific compatibility styles are provided by the theme. */
.rte-watch-banner,.rte-watch-banner *{box-sizing:border-box}
.rte-watch-banner{width:100%;margin:22px 0;padding:clamp(20px,4vw,36px);border-radius:24px;overflow:hidden;color:#fff;background:radial-gradient(circle at 100% 0,rgba(255,147,47,.25),transparent 36%),linear-gradient(145deg,#08090c,#171a22);border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 50px rgba(0,0,0,.25)}
.rte-watch-banner__intro{max-width:720px;margin-bottom:22px}.rte-watch-banner__eyebrow{display:block;margin-bottom:7px;color:#ffb86b;font-size:.72rem;font-weight:800;letter-spacing:.14em}
.rte-watch-banner h2{margin:0 0 7px!important;color:#fff!important;font-size:clamp(1.45rem,3vw,2.15rem)!important;line-height:1.12!important}.rte-watch-banner p{margin:0!important;color:rgba(255,255,255,.72)!important}
.rte-watch-banner__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.rte-watch-card{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;gap:15px;min-width:0;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.065)}
.rte-watch-card--banbile{background:linear-gradient(145deg,rgba(91,41,214,.22),rgba(0,122,255,.13)),rgba(255,255,255,.065)}.rte-watch-card__logo{display:grid;place-items:center;width:110px;height:92px;padding:12px;border-radius:14px;overflow:hidden}.rte-watch-card__logo--white{background:#fff}.rte-watch-card__logo--dark{background:#030305}
.rte-watch-card__logo img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;opacity:1!important;visibility:visible!important}.rte-watch-card__copy{min-width:0}.rte-watch-card__copy>span{display:block;margin-bottom:5px;color:#ffb86b;font-size:.67rem;font-weight:800;letter-spacing:.11em}.rte-watch-card__copy strong{display:block;margin-bottom:5px;color:#fff;font-size:clamp(1rem,2vw,1.3rem);line-height:1.15}.rte-watch-card__copy small{display:block;color:rgba(255,255,255,.7);font-size:.82rem;line-height:1.35}
@media(max-width:950px){.rte-watch-banner__grid{grid-template-columns:1fr}.rte-watch-card{grid-template-columns:105px minmax(0,1fr)}.rte-watch-card__logo{width:105px;height:84px}}
@media(max-width:520px){.rte-watch-banner{padding:17px;border-radius:18px}.rte-watch-banner__intro{margin-bottom:16px}.rte-watch-card{grid-template-columns:78px minmax(0,1fr);gap:11px;padding:11px;border-radius:14px}.rte-watch-card__logo{width:78px;height:68px;padding:8px}.rte-watch-card__copy small{font-size:.76rem}}


/* v1.1.2 — compact mobile banner */
@media (max-width: 640px){
  .rte-watch-banner{
    margin:12px 0!important;
    padding:13px!important;
    border-radius:15px!important;
  }

  .rte-watch-banner__intro{
    margin-bottom:12px!important;
  }

  .rte-watch-banner__eyebrow{
    margin-bottom:4px!important;
    font-size:.58rem!important;
    letter-spacing:.1em!important;
  }

  .rte-watch-banner h2{
    margin-bottom:4px!important;
    font-size:1.18rem!important;
    line-height:1.12!important;
  }

  .rte-watch-banner p{
    font-size:.78rem!important;
    line-height:1.35!important;
  }

  .rte-watch-banner__grid{
    gap:8px!important;
  }

  .rte-watch-card{
    grid-template-columns:62px minmax(0,1fr)!important;
    gap:9px!important;
    min-height:76px!important;
    padding:8px!important;
    border-radius:12px!important;
  }

  .rte-watch-card__logo{
    width:62px!important;
    height:56px!important;
    padding:7px!important;
    border-radius:9px!important;
  }

  .rte-watch-card__copy>span{
    margin-bottom:2px!important;
    font-size:.53rem!important;
    letter-spacing:.08em!important;
  }

  .rte-watch-card__copy strong{
    margin-bottom:2px!important;
    font-size:.92rem!important;
    line-height:1.08!important;
  }

  .rte-watch-card__copy small{
    font-size:.67rem!important;
    line-height:1.22!important;
  }
}

@media (max-width: 380px){
  .rte-watch-banner{
    padding:10px!important;
  }

  .rte-watch-card{
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:8px!important;
    padding:7px!important;
  }

  .rte-watch-card__logo{
    width:54px!important;
    height:50px!important;
    padding:6px!important;
  }

  .rte-watch-card__copy strong{
    font-size:.84rem!important;
  }

  .rte-watch-card__copy small{
    font-size:.62rem!important;
  }
}


/* v1.1.3 — clean compact banner, platform logos only */
.rte-watch-banner__intro p{display:none!important}

@media (max-width: 640px){
  .rte-watch-banner{
    padding:10px!important;
    margin:10px 0!important;
    border-radius:13px!important;
  }

  .rte-watch-banner__intro{
    margin-bottom:8px!important;
  }

  .rte-watch-banner__eyebrow{
    font-size:.5rem!important;
    margin-bottom:2px!important;
    letter-spacing:.09em!important;
  }

  .rte-watch-banner h2{
    font-size:1rem!important;
    margin:0!important;
    line-height:1.1!important;
  }

  .rte-watch-banner__grid{
    gap:6px!important;
  }

  .rte-watch-card{
    grid-template-columns:50px minmax(0,1fr)!important;
    min-height:62px!important;
    gap:8px!important;
    padding:6px!important;
    border-radius:10px!important;
  }

  .rte-watch-card__logo{
    width:50px!important;
    height:46px!important;
    padding:5px!important;
    border-radius:8px!important;
  }

  .rte-watch-card__copy>span{
    font-size:.47rem!important;
    margin-bottom:1px!important;
  }

  .rte-watch-card__copy strong{
    font-size:.82rem!important;
    margin-bottom:1px!important;
  }

  .rte-watch-card__copy small{
    font-size:.59rem!important;
    line-height:1.15!important;
  }
}

@media (max-width: 380px){
  .rte-watch-banner{
    padding:8px!important;
  }

  .rte-watch-card{
    grid-template-columns:45px minmax(0,1fr)!important;
    gap:7px!important;
    min-height:56px!important;
  }

  .rte-watch-card__logo{
    width:45px!important;
    height:42px!important;
  }

  .rte-watch-card__copy strong{
    font-size:.76rem!important;
  }

  .rte-watch-card__copy small{
    font-size:.55rem!important;
  }
}


/* v1.1.4 — final platform-only banner */
.rte-watch-banner{
  width:100%!important;
  margin:16px 0!important;
  padding:16px!important;
  border-radius:18px!important;
}

.rte-watch-banner__intro,
.rte-watch-banner__eyebrow,
.rte-watch-banner h2,
.rte-watch-banner p{
  display:none!important;
}

.rte-watch-banner__title{
  margin:0 0 12px!important;
  color:#fff!important;
  font-size:1.05rem!important;
  font-weight:800!important;
  line-height:1.2!important;
}

/* Never show the Télé Éclair website/player thumbnail inside this banner. */
.rte-watch-banner img[src*="eclair-tv-logo.png"],
.rte-watch-banner img[src*="radioteleeclair.com/wp-content/themes/radio-tele-eclair-pro/assets/images/eclair-tv-logo.png"]{
  display:none!important;
}

.rte-watch-banner__grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}

.rte-watch-card{
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  align-items:center!important;
  min-height:78px!important;
  gap:10px!important;
  padding:9px!important;
  border-radius:13px!important;
}

.rte-watch-card__logo{
  width:72px!important;
  height:58px!important;
  padding:7px!important;
  border-radius:9px!important;
}

.rte-watch-card__copy strong{
  display:block!important;
  margin:0 0 3px!important;
  color:#fff!important;
  font-size:.95rem!important;
  font-weight:800!important;
  line-height:1.1!important;
}

.rte-watch-card__copy span{
  display:block!important;
  margin:0!important;
  color:rgba(255,255,255,.72)!important;
  font-size:.72rem!important;
  font-weight:600!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

.rte-watch-card__copy small{
  display:none!important;
}

@media(max-width:700px){
  .rte-watch-banner{
    margin:10px 0!important;
    padding:10px!important;
    border-radius:13px!important;
  }

  .rte-watch-banner__title{
    margin-bottom:8px!important;
    font-size:.9rem!important;
  }

  .rte-watch-banner__grid{
    grid-template-columns:1fr!important;
    gap:6px!important;
  }

  .rte-watch-card{
    grid-template-columns:50px minmax(0,1fr)!important;
    min-height:56px!important;
    gap:8px!important;
    padding:6px!important;
    border-radius:9px!important;
  }

  .rte-watch-card__logo{
    width:50px!important;
    height:44px!important;
    padding:5px!important;
    border-radius:7px!important;
  }

  .rte-watch-card__copy strong{
    margin-bottom:1px!important;
    font-size:.79rem!important;
  }

  .rte-watch-card__copy span{
    font-size:.62rem!important;
  }
}

@media(max-width:380px){
  .rte-watch-banner{
    padding:8px!important;
  }

  .rte-watch-banner__title{
    font-size:.82rem!important;
  }

  .rte-watch-card{
    grid-template-columns:46px minmax(0,1fr)!important;
    min-height:52px!important;
    padding:5px!important;
  }

  .rte-watch-card__logo{
    width:46px!important;
    height:40px!important;
    padding:4px!important;
  }
}


/* v1.1.5 — mobile overlap and player text fixes */
@media (max-width: 700px){

  /* Keep the video/player title and helper text from overlapping the banner. */
  .rte-tv-player,
  .tv-player,
  .video-player,
  .player-wrapper,
  .entry-content video,
  .entry-content iframe{
    position:relative!important;
    z-index:1!important;
  }

  .rte-watch-banner{
    position:relative!important;
    z-index:2!important;
    clear:both!important;
    margin-top:12px!important;
    margin-bottom:14px!important;
  }

  /* Common title selectors used by the Télé Éclair TV player/theme. */
  .rte-tv-title,
  .tv-title,
  .player-title,
  .rte-player-title,
  .video-title,
  .entry-content .rte-title{
    position:static!important;
    width:auto!important;
    max-width:100%!important;
    margin:10px 14px 6px!important;
    padding:0!important;
    font-size:1.22rem!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    transform:none!important;
    z-index:auto!important;
  }

  /* Helper/call-to-action text such as “Appuyez sur lecture…” */
  .rte-tv-hint,
  .tv-hint,
  .player-hint,
  .rte-player-message,
  .video-message,
  .rte-watch-message,
  .entry-content .player-description{
    position:static!important;
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    margin:0 14px 10px!important;
    padding:0!important;
    font-size:.82rem!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    transform:none!important;
    z-index:auto!important;
  }

  .rte-watch-banner__title{
    margin:0 0 7px!important;
    font-size:.86rem!important;
    line-height:1.1!important;
  }

  .rte-watch-banner__grid{
    gap:5px!important;
  }

  .rte-watch-card{
    grid-template-columns:48px minmax(0,1fr)!important;
    min-height:54px!important;
    padding:5px!important;
    gap:8px!important;
  }

  .rte-watch-card__logo{
    width:48px!important;
    height:42px!important;
    padding:4px!important;
  }

  .rte-watch-card__copy{
    min-width:0!important;
    overflow:hidden!important;
  }

  .rte-watch-card__copy strong{
    font-size:.78rem!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .rte-watch-card__copy span{
    font-size:.6rem!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Extra safety for narrow iPhones */
@media (max-width: 390px){
  .rte-watch-banner{
    padding:7px!important;
    border-radius:11px!important;
  }

  .rte-watch-card{
    grid-template-columns:44px minmax(0,1fr)!important;
    min-height:50px!important;
    gap:7px!important;
    padding:4px!important;
  }

  .rte-watch-card__logo{
    width:44px!important;
    height:38px!important;
  }

  .rte-watch-card__copy strong{
    font-size:.74rem!important;
  }

  .rte-watch-card__copy span{
    font-size:.57rem!important;
  }
}


/* v1.1.6 — fullscreen mobile support */
.rte-tv-player:fullscreen,
.tv-player:fullscreen,
.video-player:fullscreen,
.player-wrapper:fullscreen,
.rte-player-shell:fullscreen,
.rte-tv-player:-webkit-full-screen,
.tv-player:-webkit-full-screen,
.video-player:-webkit-full-screen,
.player-wrapper:-webkit-full-screen,
.rte-player-shell:-webkit-full-screen{
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background:#000!important;
}

.rte-tv-player:fullscreen video,
.tv-player:fullscreen video,
.video-player:fullscreen video,
.player-wrapper:fullscreen video,
.rte-player-shell:fullscreen video,
.rte-tv-player:-webkit-full-screen video,
.tv-player:-webkit-full-screen video,
.video-player:-webkit-full-screen video,
.player-wrapper:-webkit-full-screen video,
.rte-player-shell:-webkit-full-screen video{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#000!important;
}

@media (max-width:700px){
  .rte-fullscreen-btn,
  .tv-fullscreen-btn,
  .player-fullscreen,
  [data-rte-fullscreen]{
    position:relative!important;
    z-index:10!important;
    min-width:44px!important;
    min-height:44px!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
}

/* v1.2.1 — TV offline state */
.rte-tv-player,.tv-player,.video-player,.player-wrapper,.rte-player-shell{position:relative}
.rte-tv-offline-notice{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.82);color:#fff;text-align:center}
.rte-tv-offline-notice[hidden]{display:none!important}
.rte-tv-offline-card{max-width:520px;display:flex;flex-direction:column;align-items:center;gap:10px}
.rte-tv-offline-card strong{font-size:clamp(18px,3vw,28px);line-height:1.2}
.rte-tv-offline-card span{font-size:14px;line-height:1.45;opacity:.86}
.rte-tv-offline-card button{border:0;border-radius:999px;padding:11px 19px;font-weight:700;cursor:pointer;background:#fff;color:#111}
@media(max-width:600px){.rte-tv-offline-notice{padding:12px}.rte-tv-offline-card strong{font-size:18px}.rte-tv-offline-card button{padding:9px 15px}}
