/* 유튜브 플레이리스트 제목 줄바꿈 */

#youtubeLong .e-tab-title-text,

#youtubeLong .e-tab-title-text button{

  white-space: normal !important;   /* nowrap 제거 */

  overflow: visible !important;

  text-overflow: unset !important;

  

}

/* 플레이리스트 상단 헤더(Playlist + 드롭다운 화살표) 숨김 */

#youtubeLong .e-tabs-header{

  display: none !important;

}

/* (가장 확실) 해당 롱폼 섹션 전체 video 영역 라운딩 */

#youtubeLong .e-tabs-content-wrapper .e-tab-content.e-active{

  display: block;

  border-radius: 30px;

  overflow: hidden;

}

@media (min-width: 768px){

  #youtubeLong .e-tabs-content-wrapper .e-tab-content.e-active{

    margin-right: 30px;

  }

}

/* iframe도 같이 라운딩 (보조) */

#youtubeLong .e-tabs-content-wrapper .e-tab-content.e-active iframe{

  border-radius: 30px;

}

#youtubeLong .e-tab-thumbnail,

#youtubeLong .e-tab-thumbnail img{

    width: 150px !important;

  height: 84px !important;   /* 16:9면 150*0.5625=84 */

  overflow: hidden !important;

  border-radius: 8px;        /* 원하면 */

  background: transparent !important;

}

								/* 탭 리스트 전체 간격 */

#youtubeLong .e-tabs-items{

  display: flex;

  flex-direction: column;

  gap: 10px; /* 탭끼리 간격 */

}



/* 각 탭(한 줄) 높이 자동 + 여백 */

.e-tabs-items .e-tab-title{

  height: auto !important;

  min-height: 84px !important;          /* 너무 낮아지는 것 방지 (원하면 숫자 조절) */

  padding: 10px 12px !important;

  box-sizing: border-box;

  align-items: center;       /* 내부 정렬 안정화 */

}

/* =========================

   Elementor Video Playlist - 영상 위 VIEW 배지 (hover)

   대상: .e-tabs-main-area 안의 활성 영상(.e-tab-content.e-active)

   ========================= */



/* 기준점 */

#youtubeLong .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content{

  position: relative;

  overflow: hidden;

}



/* iframe은 아래 레이어로 */

#youtubeLong .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content iframe{

  position: relative;

  z-index: 1;

  display: block;

  width: 100%;

}



/* (선택) 살짝 어두워지는 오버레이 레이어 */

#youtubeLong .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content::before{

  content: "";

  position: absolute;

  inset: 0;

  z-index: 2;

  background: rgba(0,0,0,.0);

  opacity: 0;

  transition: opacity .18s ease;

  pointer-events: none;

}



/* VIEW 원형 배지 */

#youtubeLong .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content::after{

  content: "VIEW";

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(.92);



  width: 76px;

  height: 76px;

  border-radius: 999px;



  background: rgba(181, 126, 120); /* #b57e78 */

  color: #fff;



  display: flex;

  align-items: center;

  justify-content: center;



  font-weight: 700;

  font-size: 13px;

  letter-spacing: 1.6px;



  opacity: 0;

  transition: opacity .18s ease, transform .18s ease;

  pointer-events: none;

  z-index: 3;

}



/* hover 지원 기기에서만 */

@media (hover:hover) and (pointer:fine){

  /* 활성 영상에서만 뜨게 */

#youtubeLong  .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content.e-active:hover::after{

    opacity: 1;

    transform: translate(-50%, -50%) scale(1);

  }



  .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content.e-active:hover::before{

    opacity: 1;

    background: rgba(0,0,0,.12);

  }



  /* (선택) 영상 살짝 톤다운(iframe에도 적용됨) */

#youtubeLong  .e-tabs-main-area .e-tabs-content-wrapper .e-tab-content.e-active:hover iframe{

    filter: brightness(.92);

    transition: filter .18s ease;

  }

}
