/* Ferney Vidéos (Mosaïque / Carousel) */

.fvm-wrap{
  --fvm-gap: 16px;
  --fvm-radius: 18px;
  --fvm-shadow: 0 10px 30px rgba(0,0,0,.08);
  --fvm-border: rgba(0,0,0,.08);
  --fvm-bg: #fff;
  --fvm-muted: rgba(0,0,0,.65);
  --fvm-accent: #2a7a44;
  margin: 24px 0;
}

.fvm-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin: 0 0 12px; }
.fvm-headleft{ display:flex; align-items:center; gap:12px; min-width: 0; }
.fvm-brand{ display:flex; align-items:center; gap:10px; }
.fvm-brand img{ height: var(--fvm-logo-size, 44px); width:auto; display:block; }
.fvm-title{ margin:0; font-size: clamp(1.2rem, 2vw, 1.6rem); line-height:1.2; }

.fvm-grid{
  display:grid;
  gap: var(--fvm-gap);
}

/* responsive columns based on data attribute */
.fvm-wrap[data-columns="1"] .fvm-grid{ grid-template-columns: 1fr; }
.fvm-wrap[data-columns="2"] .fvm-grid{ grid-template-columns: repeat(2, 1fr); }
.fvm-wrap[data-columns="3"] .fvm-grid{ grid-template-columns: repeat(3, 1fr); }
.fvm-wrap[data-columns="4"] .fvm-grid{ grid-template-columns: repeat(4, 1fr); }
.fvm-wrap[data-columns="5"] .fvm-grid{ grid-template-columns: repeat(5, 1fr); }
.fvm-wrap[data-columns="6"] .fvm-grid{ grid-template-columns: repeat(6, 1fr); }


/* Smart layout: auto-fit with comfortable tile width, keeps titles readable */
.fvm-wrap{
  --fvm-tile-min: clamp(300px, 28vw, 460px);
}

.fvm-wrap[data-layout="smart"] .fvm-grid{
  grid-template-columns: repeat(auto-fit, minmax(var(--fvm-tile-min), 1fr));
}

@media (max-width: 1100px){
  .fvm-wrap[data-columns="5"] .fvm-grid,
  .fvm-wrap[data-columns="6"] .fvm-grid{ grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px){
  .fvm-wrap[data-columns="4"] .fvm-grid,
  .fvm-wrap[data-columns="5"] .fvm-grid,
  .fvm-wrap[data-columns="6"] .fvm-grid{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px){
  .fvm-grid{ grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 460px){
  .fvm-grid{ grid-template-columns: 1fr !important; }
}

.fvm-card{
  background: var(--fvm-bg);
  border: 1px solid var(--fvm-border);
  border-radius: var(--fvm-radius);
  box-shadow: var(--fvm-shadow);
  overflow:hidden;
  margin:0;
}

.fvm-media{
  position:relative;
  aspect-ratio: 4 / 3;
  background: #000;
}

.fvm-video{
  width:100%;
  height:100%;
  object-fit: contain;
  display:block;
}

/* Title bar (logo + titre + durée) */
.fvm-caption{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding: 12px 14px 14px;
  min-width:0;
}

.fvm-card-logo{
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 12px;
  background: rgba(0,0,0,.04);
  margin-top: 2px;
}

.fvm-card-logo img{
  width: 70%;
  height: 70%;
  object-fit: contain;
  display:block;
}

.fvm-card-title{
  flex: 1 1 auto;
  min-width:0;
  font-size: 1.02rem;
  font-weight: 650;
  color: rgba(0,0,0,.86);
  line-height: 1.3;
  display: block;
  overflow: visible;
  white-space: normal;
  word-break: break-word;
}

/* Optional title clamping (set via shortcode title_lines="2" etc.) */
.fvm-wrap[data-title-lines="1"] .fvm-card-title,
.fvm-wrap[data-title-lines="2"] .fvm-card-title,
.fvm-wrap[data-title-lines="3"] .fvm-card-title,
.fvm-wrap[data-title-lines="4"] .fvm-card-title,
.fvm-wrap[data-title-lines="5"] .fvm-card-title,
.fvm-wrap[data-title-lines="6"] .fvm-card-title{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.fvm-wrap[data-title-lines="1"] .fvm-card-title{ -webkit-line-clamp: 1; }
.fvm-wrap[data-title-lines="2"] .fvm-card-title{ -webkit-line-clamp: 2; }
.fvm-wrap[data-title-lines="3"] .fvm-card-title{ -webkit-line-clamp: 3; }
.fvm-wrap[data-title-lines="4"] .fvm-card-title{ -webkit-line-clamp: 4; }
.fvm-wrap[data-title-lines="5"] .fvm-card-title{ -webkit-line-clamp: 5; }
.fvm-wrap[data-title-lines="6"] .fvm-card-title{ -webkit-line-clamp: 6; }



.fvm-card-meta{
  flex: 0 0 auto;
  font-size: .82rem;
  color: rgba(0,0,0,.55);
  padding-left: 10px;
  border-left: 1px solid rgba(0,0,0,.08);
  align-self: flex-start;
  margin-top: 2px;
  white-space: nowrap;
}

/* Card hover + play overlay */
.fvm-card{
  transition: transform .15s ease, box-shadow .15s ease;
}
.fvm-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(0,0,0,.12);
}

.fvm-media{
  position:relative;
  overflow:hidden;
}

/* play icon */
.fvm-card .fvm-media::before{
  content:"";
  position:absolute;
  left: 14px;
  bottom: 14px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  opacity: .0;
  transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease;
  pointer-events:none;
}

.fvm-media::after{
  content:"";
  position:absolute;
  left: 30px;
  bottom: 27px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 0 9px 14px;
  border-color: transparent transparent transparent rgba(255,255,255,.92);
  opacity: .0;
  transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease;
  pointer-events:none;
}

.fvm-card:hover .fvm-card .fvm-media::before,
.fvm-card:hover .fvm-media::after{
  opacity: 1;
  transform: translateY(0);
}


.fvm-modal{ position:fixed; inset:0; z-index: 99999; }
.fvm-modal[hidden]{ display:none !important; }

.fvm-modal__overlay{ position:absolute; inset:0; background: rgba(0,0,0,.6); }

.fvm-modal__dialog{
  position:relative;
  width: min(980px, calc(100vw - 32px));
  max-height: 92vh;
  margin: 4vh auto;
  background: #fff;
  border-radius: 22px;
  overflow:hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  display:flex;
  flex-direction: column;
}

.fvm-modal__close{
  position:absolute;
  right: 10px;
  top: 10px;
  border:0;
  background: rgba(255,255,255,.9);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.fvm-modal__close svg{ display:block; }
.fvm-modal__close:hover{ filter: brightness(.98); transform: translateY(-1px); }

.fvm-modal__head{ padding: 16px 18px 0; }
.fvm-modal__title{ font-size: 1.1rem; font-weight: 700; }

.fvm-modal__body{ padding: 14px 18px 12px; flex: 1 1 auto; min-height: 0; }
.fvm-modal__ratio{ aspect-ratio: 4 / 3; background:#000; border-radius: 16px; overflow:hidden; max-height: calc(92vh - 170px); }
.fvm-modal__video{ width:100%; height:100%; object-fit: contain; display:block; }

.fvm-modal__actions{
  display:flex;
  gap:10px;
  padding: 0 18px 18px;
  flex-wrap: wrap;
}
.fvm-share{
  border: 1px solid var(--fvm-border);
  background: #fff;
  border-radius: 999px;
  padding: 10px 14px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
}
.fvm-share:hover{ transform: translateY(-1px); }
.fvm-share--primary{ border-color: rgba(42,122,68,.25); box-shadow: 0 10px 20px rgba(42,122,68,.08); }
.fvm-share__dot{ width:10px; height:10px; border-radius:999px; background: var(--fvm-accent); display:inline-block; }

/* small toast */
.fvm-toast{
  position:fixed;
  left:50%;
  bottom: 18px;
  transform: translateX(-50%);
  background: rgba(0,0,0,.85);
  color:#fff;
  padding: 10px 14px;
  border-radius: 999px;
  font-size: .95rem;
  z-index: 100000;
}
.fvm-toast[hidden]{ display:none !important; }


/* Click anywhere on the preview to open modal (no floating button) */
.fvm-wrap[data-modal="1"] .fvm-media{ cursor: pointer; }
.fvm-wrap[data-modal="1"] .fvm-card:hover .fvm-media{ outline: 2px solid rgba(255,255,255,.18); outline-offset:-2px; }