/* Shorts 버튼 컨테이너 */
.ssb-container{position:fixed;top:50%;right:15px;transform:translateY(-50%);z-index:998;flex-direction:column;gap:20px}
.ssb-button-wrapper{display:flex;flex-direction:column;align-items:center;gap:5px}
.ssb-btn{background-color:rgba(0,0,0,0.05);border:none;border-radius:50%;width:48px;height:48px;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color .2s ease, transform .1s ease;padding:0}
.ssb-btn:hover{background-color:rgba(0,0,0,0.1)}
.ssb-btn:focus-visible{outline:2px solid #065fd4;outline-offset:2px;}
.ssb-btn:active{transform:scale(0.95)}
.ssb-btn svg{width:24px;height:24px;fill:#0f0f0f;pointer-events:none;}
.ssb-btn.active svg{fill:#ff0000} /* 좋아요 */
#ssb-bookmark-btn.active svg{fill:#065fd4} /* 북마크 */
.ssb-count{color:#333;font-size:13px;font-weight:500}

/* 댓글 패널 */
#ssb-comments-panel{position:fixed;top:0;right:0;width:400px;max-width:90%;height:100%;background-color:#fff;box-shadow:-2px 0 8px rgba(0,0,0,0.15);z-index:1000;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease-in-out;}
#ssb-comments-panel.ssb-panel-visible{transform:translateX(0)}

#ssb-comments-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;border-bottom:1px solid #eee;flex-shrink:0}
#ssb-comments-header h3{margin:0;font-size:16px;font-weight:600;}
#ssb-close-comments{background:0 0;border:none;font-size:28px;cursor:pointer;line-height:1;padding:0 5px}
#ssb-comments-content{padding:10px 20px;overflow-y:auto;flex-grow:1}

/* 새 댓글 UI 스타일 */
#ssb-comments-content .ssb-comment-list {list-style: none; margin: 0; padding: 0;}
#ssb-comments-content .ssb-comment-item {padding: 15px 0; border-bottom: 1px solid #f0f0f0; }
#ssb-comments-content .ssb-comment-body {display: flex; gap: 12px; align-items: flex-start;}
#ssb-comments-content .ssb-comment-body .avatar {border-radius: 50%; width: 40px; height: 40px; flex-shrink: 0;}
#ssb-comments-content .ssb-comment-content {display: flex; flex-direction: column; align-items: flex-start;}
#ssb-comments-content .ssb-comment-author {font-weight: 600; font-size: 14px; color: #333; text-decoration: none;}
#ssb-comments-content .ssb-comment-author a {color: inherit; text-decoration: none;}
#ssb-comments-content .ssb-comment-content p {margin: 2px 0 4px; font-size: 14px; line-height: 1.5; color: #111;}
#ssb-comments-content .ssb-comment-time {font-size: 12px; color: #777;}
#ssb-comments-content .no-comments-yet, #ssb-comments-content .ssb-spinner{text-align:center;padding:40px 20px;font-size:14px;color:#888;}

/* 댓글 패널 하단 (미니폼 영역) */
#ssb-comments-footer{padding:10px 15px;border-top:1px solid #eee;background-color:#fff;flex-shrink:0; box-shadow: 0 -2px 5px rgba(0,0,0,0.05);}
#ssb-mini-comment-form{display:flex;flex-direction:column;gap:8px;}
.ssb-textarea-wrapper { display: flex; align-items: center; gap: 10px; }
.ssb-form-avatar .avatar{border-radius:50%;}
#ssb-comment-textarea{flex-grow:1;border:1px solid #ddd;border-radius:18px;padding:10px 15px;height:80px;resize:none;font-size:14px;transition:border-color .2s; background: #f2f2f2; border: none;}
#ssb-comment-textarea:focus{outline:none;background: #e8e8e8;}
#ssb-mini-comment-form button[type="submit"]{background:0 0;border:none;cursor:pointer;padding:5px;display:flex;align-items:center;justify-content:center}
#ssb-mini-comment-form button[type="submit"] svg{fill:#333; transition: transform 0.2s;}
#ssb-mini-comment-form button[type="submit"]:hover svg{transform: scale(1.1);}
.ssb-login-prompt{text-align:center;font-size:14px;color:#555;margin:10px 0}
.ssb-login-prompt a {color: #065fd4; text-decoration: none;}

/* [추가] 폼 메시지 스타일 */
.ssb-form-message {
    font-size: 13px;
    padding: 8px 12px;
    border-radius: 4px;
    margin: 0;
    text-align: center;
}
.ssb-form-message.error {
    background-color: #ffebeB;
    color: #c00;
}

/* 댓글 패널 오버레이 */
#ssb-comments-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.4);z-index:999;transition:opacity .3s ease-in-out;opacity:0;pointer-events:none;}
#ssb-comments-overlay.ssb-overlay-visible{opacity:1;pointer-events:auto;}

/* 북마크 목록 페이지 스타일 */
.ssb-bookmarks-list{list-style:none;margin:2em 0 0;padding:0;}
.ssb-bookmarks-list li a{display:flex;align-items:center;gap:15px;padding:10px;border-bottom:1px solid #eee;text-decoration:none;color:#333}
.ssb-bookmarks-list li a:hover{background-color:#f9f9f9}
.ssb-bookmarks-list li img{width:80px;height:80px;object-fit:cover;border-radius:4px;flex-shrink:0;}
.ssb-bookmarks-list li span{font-size:16px;font-weight:bold;}

@media (max-width:768px){.ssb-container{right:5px}.ssb-btn{width:42px;height:42px}}
/* --- SSB threaded comments polish --- */

/* 기본 레이아웃 */
.ssb-comment-item { margin: 12px 0 0; }
.ssb-comment-body { display: flex; gap: 10px; }
.ssb-comment-avatar img { border-radius: 50%; }
.ssb-comment-content { flex: 1; }

/* 작성자/시간 라인 */
.ssb-comment-meta { display: flex; gap: 8px; align-items: baseline; }
.ssb-comment-author, .ssb-comment-author a { font-weight: 600; color: #111827; }
.ssb-comment-time { color: #9ca3af; font-size: 12px; }
.ssb-comment-text { margin-top: 4px; color: #111827; line-height: 1.55; }

/* children(대댓글) 들여쓰기 & 구분선 */
.ssb-comment-list .children {
  margin: 8px 0 0 24px;          /* 좌측 들여쓰기 */
  padding-left: 12px;
  border-left: 2px solid #f0f0f0; /* 얇은 가이드 라인 */
}

/* 답글 버튼을 링크형 칩 스타일로 (선택자 수정: #ssb-panel 제거) */
.ssb-comment-actions { margin-top: 6px; }
.ssb-comment-actions .ssb-reply-btn {
  display: inline-flex; align-items: center; gap: 6px;
  width: auto; /* 큰 고정폭 방지 */
  padding: 4px 10px;
  font-size: 12px; line-height: 1;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  background: #1f2937;
  box-shadow: none;
  cursor: pointer;
  text-decoration: none;
}

/* hover/focus/active 상태 (선택자 수정) */
.ssb-comment-actions .ssb-reply-btn:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}
.ssb-comment-actions .ssb-reply-btn:focus-visible {
  outline: 2px solid #6366f1;
  outline-offset: 2px;
}
.ssb-comment-actions .ssb-reply-btn:active {
  transform: translateY(1px);
}

/* 다크 모드 보정(선택자 수정) */
@media (prefers-color-scheme: dark) {
  .ssb-comment-author, .ssb-comment-author a { color: #e5e7eb; }
  .ssb-comment-time { color: #9ca3af; }
  .ssb-comment-text { color: #e5e7eb; }
  .ssb-comment-actions .ssb-reply-btn {
    background: #1f2937; border-color: #374151;
  }
  .ssb-comment-actions .ssb-reply-btn:hover {
    background: #2b3548; border-color: #475569; color: #cbd5e1;
  }
}
#ssb-cancel-reply{
  display:none;
  padding:4px 10px;
  font-size:12px;
  border-radius:999px;
  border:1px solid #e5e7eb;
  background:#fff;
  color:#6b7280;
  cursor:pointer;
}
#ssb-cancel-reply:hover{ background:#f3f4f6; }
