/* ===============================================
   SH MEDIA2 (VLOG) – 카드형 리스트 스타일
   - 좌측 썸네일 / 우측 텍스트
   - ✅ VLOG 페이지에서 '가운데 글쓰기'만 제거
   - ⚠️ 게시글 링크(mod=document)는 절대 숨기지 않음
================================================ */

/* =================================================
   ✅ VLOG 페이지: KBoard 상단 컨트롤(글쓰기 포함)만 숨김
   - 제목 아래 가운데 큰 글쓰기 제거 목적
   - 게시글 링크는 건드리지 않음
================================================= */
.sh-vlog-page .kboard-control,
.sh-vlog-page .kboard-control-left,
.sh-vlog-page .kboard-control-right,
.sh-vlog-page .kboard-default-button,
.sh-vlog-page .kboard-default-button-right,
.sh-vlog-page .kboard-write,
.sh-vlog-page .kboard-write-button,
.sh-vlog-page .kboard-button-write,
.sh-vlog-page a.kboard-write-button{
  display:none !important;
}

/* ===============================
   LIST WRAPPER
=============================== */
#kboard-sh-media2-list{
  width:100%;
  box-sizing:border-box;
}

/* 리스트 묶음 */
#kboard-sh-media2-list .kboard-sh-media2-items{
  display:flex;
  flex-direction:column;
  gap:14px;
}

/* 카드 */
#kboard-sh-media2-list .kboard-sh-media2-item{
  display:flex;
  align-items:flex-start;
  gap:22px;
  padding:20px 22px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  background:#fff;
  text-decoration:none;
  color:inherit;
  transition: background .15s ease, border-color .15s ease;
}
#kboard-sh-media2-list .kboard-sh-media2-item:hover{
  background:#fafafa;
  border-color:rgba(0,0,0,.16);
}

/* 썸네일 */
#kboard-sh-media2-list .kboard-sh-media2-thumb{
  flex:0 0 320px;
  height:180px;
  border-radius:12px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  position:relative;
  overflow:hidden;
}

/* ▶ 재생 오버레이 */
#kboard-sh-media2-list .kboard-sh-media2-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0);
  transition: background .18s ease;
}
#kboard-sh-media2-list .kboard-sh-media2-thumb::before{
  content:"▶";
  position:absolute;
  left:16px;
  bottom:14px;
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  font-weight:900;
  color:#fff;
  background:rgba(0,0,0,0.55);
  box-shadow:0 10px 22px rgba(0,0,0,0.18);
  transition: transform .18s ease, background .18s ease;
}
#kboard-sh-media2-list .kboard-sh-media2-item:hover .kboard-sh-media2-thumb::after{
  background:rgba(0,0,0,0.10);
}
#kboard-sh-media2-list .kboard-sh-media2-item:hover .kboard-sh-media2-thumb::before{
  background:rgba(0,0,0,0.62);
  transform: translateY(-1px);
}

/* 본문 */
#kboard-sh-media2-list .kboard-sh-media2-body{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* 상단 정보 */
#kboard-sh-media2-list .kboard-sh-media2-top{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#666;
}

/* 카테고리 */
#kboard-sh-media2-list .kboard-sh-media2-cat{
  padding:5px 10px;
  border-radius:999px;
  background:#f1f3f5;
  font-weight:800;
  color:#333;
}

/* 날짜 */
#kboard-sh-media2-list .kboard-sh-media2-date{
  color:#999;
}

/* 제목 */
#kboard-sh-media2-list .kboard-sh-media2-title{
  font-size:19px;
  font-weight:900;
  line-height:1.35;
  color:#111;
  word-break:keep-all;
}

/* 비밀글 아이콘 */
#kboard-sh-media2-list .kboard-sh-media2-lock{
  margin-left:6px;
  font-size:14px;
}

/* 소제목 */
#kboard-sh-media2-list .kboard-sh-media2-subtitle{
  font-size:14px;
  line-height:1.6;
  color:#555;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* 비어있을 때 */
#kboard-sh-media2-list .kboard-sh-media2-empty{
  padding:32px;
  border:1px dashed rgba(0,0,0,.18);
  border-radius:14px;
  text-align:center;
  color:#888;
}

/* 페이지네이션 */
#kboard-sh-media2-list .kboard-sh-media2-pagination{
  margin-top:28px;
}
#kboard-sh-media2-list .kboard-pagination-pages{
  display:flex;
  justify-content:center;
  gap:6px;
}
#kboard-sh-media2-list .kboard-pagination-pages li{
  list-style:none;
}
#kboard-sh-media2-list .kboard-pagination-pages a,
#kboard-sh-media2-list .kboard-pagination-pages span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:34px;
  border-radius:8px;
  font-size:13px;
}

/* ===============================
   MOBILE
=============================== */
@media (max-width: 768px){

  #kboard-sh-media2-list .kboard-sh-media2-item{
    flex-direction:column;
    padding:18px;
    gap:14px;
  }

  #kboard-sh-media2-list .kboard-sh-media2-thumb{
    width:100%;
    height:200px;
  }

  #kboard-sh-media2-list .kboard-sh-media2-thumb::before{
    left:14px;
    bottom:12px;
  }

  #kboard-sh-media2-list .kboard-sh-media2-title{
    font-size:17px;
  }
}
