/* Kolytica Formation : affichage large et agrandissement des visuels de cours. */
body.learning-course-page .cplay-figure{
  position:relative;
}
body.learning-course-page .cplay-figure-zoom{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin:12px 0 0;
  padding:9px 16px;
  border:1.5px solid var(--learn-teal, #0F9D8C);
  border-radius:999px;
  background:#fff;
  color:var(--learn-navy, #14224F);
  font:700 .92rem/1.2 system-ui, sans-serif;
  cursor:pointer;
}
body.learning-course-page .cplay-figure-zoom:hover,
body.learning-course-page .cplay-figure-zoom:focus-visible{
  background:rgba(15,157,140,.08);
  outline:2px solid var(--learn-teal, #0F9D8C);
  outline-offset:3px;
}
body.learning-course-page .cplay-figure img{
  cursor:zoom-in;
}
body.learning-course-page .cplay-visual-dialog{
  width:min(96vw, 1280px);
  max-width:none;
  max-height:94dvh;
  margin:auto;
  padding:0;
  border:0;
  border-radius:22px;
  background:#fff;
  color:var(--learn-ink, #23324D);
  box-shadow:0 28px 90px rgba(20,34,79,.32);
}
body.learning-course-page .cplay-visual-dialog::backdrop{
  background:rgba(20,34,79,.78);
  backdrop-filter:blur(5px);
}
body.learning-course-page .cplay-visual-dialog-card{
  display:flex;
  flex-direction:column;
  max-height:94dvh;
}
body.learning-course-page .cplay-visual-dialog-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 18px;
  border-bottom:1px solid var(--learn-line, #C9D7E6);
}
body.learning-course-page .cplay-visual-dialog-head strong{
  color:var(--learn-navy, #14224F);
}
body.learning-course-page .cplay-visual-dialog-close{
  min-width:44px;
  min-height:44px;
  border:1px solid var(--learn-line, #C9D7E6);
  border-radius:50%;
  background:#fff;
  color:var(--learn-navy, #14224F);
  font:800 1.3rem/1 system-ui, sans-serif;
  cursor:pointer;
}
body.learning-course-page .cplay-visual-dialog-body{
  overflow:auto;
  padding:16px;
  background:var(--learn-ivory, #FBF7EC);
}
body.learning-course-page .cplay-visual-dialog-body img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:calc(94dvh - 150px);
  margin:auto;
  border-radius:14px;
  background:#fff;
}
body.learning-course-page .cplay-visual-dialog-caption{
  margin:12px auto 0;
  max-width:80ch;
  color:var(--learn-ink, #23324D);
  font-size:1rem;
  line-height:1.55;
}
@media (min-width:920px){
  body.learning-course-page .cplay-screen[data-has-wide-visual="true"]{
    max-width:min(100%, 1080px);
  }
  body.learning-course-page .cplay-reading.has-wide-visual{
    width:min(100%, 960px);
  }
  body.learning-course-page .cplay-reading.has-wide-visual > :not(.cplay-figure){
    width:min(100%, 60ch);
    margin-left:auto;
    margin-right:auto;
  }
  body.learning-course-page .cplay-reading.has-wide-visual > .cplay-figure{
    width:min(100%, 960px);
    margin-left:auto;
    margin-right:auto;
    padding:14px 15px 16px;
  }
  body.learning-course-page .cplay-reading.has-wide-visual > .cplay-figure img{
    width:100%;
    max-height:none;
  }
}
@media (max-width:919px){
  body.learning-course-page .cplay-figure{
    margin-inline:calc(-1 * clamp(0px, 2vw, 10px));
  }
  body.learning-course-page .cplay-figure-zoom{
    width:100%;
  }
  body.learning-course-page .cplay-visual-dialog{
    width:100vw;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
  }
  body.learning-course-page .cplay-visual-dialog-card{
    max-height:100dvh;
  }
  body.learning-course-page .cplay-visual-dialog-body img{
    max-height:calc(100dvh - 150px);
  }
}
@media (prefers-reduced-motion:reduce){
  body.learning-course-page .cplay-visual-dialog,
  body.learning-course-page .cplay-visual-dialog::backdrop{
    scroll-behavior:auto;
  }
}
