@charset "utf-8";

/* =========================
   Latest: link-site style (clean)
   - 과하지 않게 "다른 사이트 위젯" 느낌
   - 가독성/시안성 우선
========================= */

.lat_site_link{
  position:relative;
  margin:0 0 14px;
  background:#fff;
  border:1px solid #e9edf3;
  border-radius:10px;
  box-shadow:0 4px 14px rgba(18, 38, 63, .06);
  overflow:hidden;
}

/* title */
.lat_site_link .lat_title{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  line-height:1.2;
  border-bottom:1px solid #eef2f7;
  background:linear-gradient(#ffffff, #fbfcfe);
  font-size:16px;
  font-weight:700;
  color:#111;
}
.lat_site_link .lat_title a{
  color:#111;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.lat_site_link .lat_title img{
  width:22px;
  height:22px;
  vertical-align:middle;
  margin:0;
}
.lat_site_link .lat_title span{
  vertical-align:middle;
}

/* list */
.lat_site_link ul{
  padding:8px 0;
  margin:0;
}
.lat_site_link li{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  line-height:1.2;
  border-bottom:1px solid #f1f4f8;
  margin:0;
}
.lat_site_link li:last-child{
  border-bottom:0;
}

/* small icon/img */
.lat_site_link li img{
  height:18px;
  width:auto;
  line-height:18px;
  vertical-align:middle;
  flex:0 0 auto;
}

/* link text */
.lat_site_link li a{
  font-weight:700;
  font-size:14px;
  line-height:1.3;
  color:#111;
  vertical-align:middle;
  text-decoration:none;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.lat_site_link li:hover{
  background:#f7f9fc;
}
.lat_site_link li a:hover{
  color:#2563eb;
}

/* info (nick/date) */
.lt_info{
  padding:0;
  margin-left:auto;
  text-align:right;
  flex:0 0 auto;
}
.lt_info .lt_date{
  display:inline-block;
  margin-left:8px;
  color:#8a94a6;
  font-size:12px;
}

/* badges / icons (정돈) */
.lat_site_link li .fa-heart{ color:#ff4d4f; }
.lat_site_link li .fa-caret-right{ color:#c3cad6; }

/* 공통 배지 스타일 */
.lat_site_link li .fa-lock,
.lat_site_link li .new_icon,
.lat_site_link li .hot_icon,
.lat_site_link li .fa-download,
.lat_site_link li .fa-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:18px;
  min-width:18px;
  padding:0 6px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  line-height:18px;
  vertical-align:middle;
  border:1px solid transparent;
}

/* 각 배지 컬러(과하지 않게) */
.lat_site_link li .fa-lock{
  color:#0f766e;
  background:#e6fffb;
  border-color:#bff7ee;
}
.lat_site_link li .new_icon{
  color:#0f766e;
  background:#eafff1;
  border-color:#c9f6d9;
}
.lat_site_link li .hot_icon{
  color:#b42318;
  background:#ffecec;
  border-color:#ffd1d1;
}
.lat_site_link li .fa-download{
  color:#9a6a00;
  background:#fff7db;
  border-color:#ffe8a3;
}
.lat_site_link li .fa-link{
  color:#6d28d9;
  background:#f3e8ff;
  border-color:#e1ccff;
}

/* comment count */
.lat_site_link .lt_cmt{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:18px;
  padding:0 6px;
  margin-left:6px;
  border-radius:999px;
  background:#eef2ff;
  color:#3a5bff;
  font-size:11px;
  font-weight:800;
  line-height:18px;
}

/* empty */
.lat_site_link .empty_li{
  line-height:120px;
  color:#8a94a6;
  text-align:center;
  padding:0 14px;
  background:#fff;
}
.lat_site_link .empty_li:before{ background:none; padding:0; }

/* more button */
.lat_site_link .lt_more{
  position:absolute;
  top:8px;
  right:8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  line-height:34px;
  color:#6b7280;
  border-radius:10px;
  text-align:center;
}
.lat_site_link .lt_more:hover{
  background:#f2f4f8;
  color:#111;
}
.lat_site_link .lt_more i{
  vertical-align:middle;
}

/* profile */
.lat_site_link .profile_img img{
  border-radius:50%;
}

/* mobile tweak */
@media (max-width: 480px){
  .lat_site_link .lat_title{ padding:12px 12px; font-size:15px; }
  .lat_site_link li{ padding:10px 12px; }
  .lat_site_link li a{ font-size:14px; }
  .lt_info .lt_date{ font-size:11px; }
}