/* ==========================================================
   BuddySocial v10.49 - VIDEO BLOCK PREMIUM POLISH
   Alleen het home-videoblok mooier. Geen bewegende emoji's.
   ========================================================== */

/* Complete video section */
.hyves-video-grid,
.member-home-video-grid{
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
  padding:12px !important;
  border-radius:14px !important;
  background:
    radial-gradient(circle at 9% 12%,rgba(255,215,99,.13),transparent 18%),
    radial-gradient(circle at 88% 20%,rgba(101,194,247,.12),transparent 20%),
    linear-gradient(180deg,rgba(247,252,255,.98),rgba(239,247,252,.96)) !important;
  border:1px solid #c1d9e8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    0 5px 16px rgba(39,82,110,.06) !important;
}

/* Main cards */
.hyves-video-card-real,
.member-home-video-card-real{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  height:100% !important;
  padding:8px !important;
  gap:7px !important;
  overflow:hidden !important;
  border:1px solid #b8d1e1 !important;
  border-radius:13px !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfd 100%) !important;
  box-shadow:
    0 5px 14px rgba(30,75,105,.08),
    inset 0 1px 0 rgba(255,255,255,.88) !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease !important;
}

.hyves-video-card-real::before,
.member-home-video-card-real::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  right:0 !important;
  height:3px !important;
  background:linear-gradient(90deg,#2f6fa8 0%,#55a6d7 45%,#f2a11a 100%) !important;
  opacity:.9 !important;
  pointer-events:none !important;
}

.hyves-video-card-real:hover,
.member-home-video-card-real:hover{
  transform:translateY(-2px) !important;
  border-color:#8dbbd8 !important;
  box-shadow:
    0 9px 22px rgba(31,79,111,.13),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
}

/* Actual video area */
.home-video-embed,
.member-home-video-embed,
.home-video-cover-link,
.member-home-video-cover{
  position:relative !important;
  width:100% !important;
  aspect-ratio:16/9 !important;
  overflow:hidden !important;
  margin:0 !important;
  border:1px solid #a9c7d9 !important;
  border-radius:10px !important;
  background:linear-gradient(135deg,#e9f2f7,#dfeaf1) !important;
  box-shadow:
    0 4px 12px rgba(29,68,95,.10),
    inset 0 0 0 1px rgba(255,255,255,.38) !important;
}

.home-video-embed::after,
.member-home-video-embed::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  box-shadow:inset 0 0 20px rgba(14,50,76,.06) !important;
  z-index:2 !important;
}

.home-video-embed iframe,
.member-home-video-embed iframe{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  display:block !important;
  z-index:1 !important;
}

/* Fallback covers */
.home-video-cover-link img,
.member-home-video-cover img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  transition:transform .25s ease !important;
}

.home-video-cover-link:hover img,
.member-home-video-cover:hover img{
  transform:scale(1.035) !important;
}

.home-video-cover-link > span,
.member-home-video-cover > span{
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#4e94c7,#2f6fa8) !important;
  border:2px solid rgba(255,255,255,.86) !important;
  color:#fff !important;
  box-shadow:0 7px 18px rgba(21,61,89,.28) !important;
}

/* Titles and dates */
.home-video-meta-link,
.member-home-video-title{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  flex:1 1 auto !important;
  padding:2px 2px 1px !important;
  text-decoration:none !important;
}

.home-video-meta-link b,
.member-home-video-title b{
  display:-webkit-box !important;
  min-height:32px !important;
  max-height:40px !important;
  overflow:hidden !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  line-clamp:2 !important;
  color:#1f587f !important;
  font-size:12px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}

.home-video-meta-link:hover b,
.member-home-video-title:hover b{
  color:#17466a !important;
}

.home-video-meta-link small{
  display:inline-flex !important;
  align-items:center !important;
  width:max-content !important;
  max-width:100% !important;
  min-height:22px !important;
  margin-top:5px !important;
  padding:2px 7px !important;
  border-radius:999px !important;
  background:#edf5fa !important;
  color:#667f91 !important;
  font-size:9px !important;
  font-weight:700 !important;
}

.home-video-meta-link small::before{
  content:"📅" !important;
  margin-right:4px !important;
  font-size:9px !important;
}

/* Subtle divider inside card */
.hyves-video-card-real .home-video-meta-link,
.member-home-video-card-real .member-home-video-title{
  border-top:1px solid #e3edf3 !important;
  padding-top:7px !important;
}

/* Home block heading */
.retro-box.member-home-media:has(.member-home-video-grid) > .retro-box-title,
.hyves-media-card:has(.hyves-video-grid) > .retro-box-title,
.hyves-media-card:has(.hyves-video-grid) > .classic-home-title{
  min-height:40px !important;
  background:linear-gradient(180deg,#dcecf7 0%,#c8dfef 100%) !important;
  border-bottom:1px solid #abc8da !important;
  color:#245a7e !important;
}

.retro-box.member-home-media:has(.member-home-video-grid) > .retro-box-title a,
.hyves-media-card:has(.hyves-video-grid) > .retro-box-title a,
.hyves-media-card:has(.hyves-video-grid) > .classic-home-title a{
  color:#2d658b !important;
  font-weight:800 !important;
}

/* Tablet */
@media(max-width:1100px){
  .hyves-video-grid,
  .member-home-video-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    padding:10px !important;
  }

  .hyves-video-card-real,
  .member-home-video-card-real{
    border-radius:12px !important;
  }
}

/* Mobile */
@media(max-width:620px){
  .hyves-video-grid,
  .member-home-video-grid{
    grid-template-columns:1fr !important;
    gap:9px !important;
    padding:8px !important;
    border-radius:11px !important;
  }

  .hyves-video-card-real,
  .member-home-video-card-real{
    display:grid !important;
    grid-template-columns:minmax(0,42%) minmax(0,1fr) !important;
    align-items:center !important;
    gap:9px !important;
    padding:7px !important;
  }

  .home-video-embed,
  .member-home-video-embed,
  .home-video-cover-link,
  .member-home-video-cover{
    grid-column:1 !important;
    border-radius:8px !important;
  }

  .home-video-meta-link,
  .member-home-video-title{
    grid-column:2 !important;
    border-top:0 !important;
    padding:0 !important;
    justify-content:center !important;
  }

  .home-video-meta-link b,
  .member-home-video-title b{
    min-height:0 !important;
    max-height:45px !important;
    font-size:12px !important;
  }

  .home-video-meta-link small{
    margin-top:6px !important;
    font-size:8px !important;
  }
}

/* Very small phones: back to stacked cards */
@media(max-width:390px){
  .hyves-video-card-real,
  .member-home-video-card-real{
    display:flex !important;
  }

  .home-video-meta-link,
  .member-home-video-title{
    border-top:1px solid #e3edf3 !important;
    padding-top:7px !important;
  }
}
