/* Wrapper */
.commentwidgetbox { margin: 8px 0; }
.commentwidgetbox ul { list-style: none; margin: 0; padding: 7px 0 0; }
.commentwidgetbox .lcw-loading { color: #999; font-size: 14px; padding: 12px 8px; list-style: none; }
.commentwidgetbox .lcw-empty { color: #999; font-size: 14px; padding: 12px 8px; list-style: none; }

/* Toggle */
.commentwidgetbox .lcw-toggle{ display:flex; gap:6px; margin:0 0 6px; }
.commentwidgetbox .lcw-tab{
  appearance:none;
  border:1px solid #000;
  background:#000;
  color:#ddd;
  font-weight:700;
  padding:6px 10px;
  border-radius:6px;
  cursor:pointer;
  transition:background .2s ease, color .2s ease;
}

.commentwidgetbox .lcw-tab:not(.lcw-tab--active):hover{
  background:#2e2e2e;
}

.commentwidgetbox .lcw-tab--active{
  background:#fff;
  color:#000;
  border-color:#000;
}

.commentwidgetbox .lcw-tab--active:hover{
  background:#fff;
  color:#000;
  border-color:#000;
}

/* Card */
.commentwidgetbox .lcw-li-style{
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  align-items: center;
  background: #222;
  border-radius: 8px;
  padding: 8px;
  margin-bottom: 6px;
  color: #c4c4c4;
  width: 100%;
  box-sizing: border-box;
  line-height: 1.3;
  box-shadow: 0 4px 10px rgba(0,0,0,.5);
  transition: transform .2s ease-out, background-color .3s ease;
}
.commentwidgetbox .lcw-li-style{
  transition: background-color .3s ease, box-shadow .25s ease, transform .2s ease;
}

.commentwidgetbox .lcw-li-style:hover{
  background:#313131;
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0,0,0,.6);
}

/* Avatar */
.commentwidgetbox .lcw-image-style{
  width: 42px; height: 42px;
  border-radius: 6px;
  display: block;
  object-fit: cover;
}

/* Content body */
.commentwidgetbox .lcw-body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:0;
}

/* Score layout */
.commentwidgetbox .lcw-body.lcw-has-score{
  display:grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: 10px;
  align-items: center;
}
.commentwidgetbox .lcw-body.lcw-has-score .lcw-row{ grid-column:1; }
.commentwidgetbox .lcw-body.lcw-has-score .lcw-rating{ grid-column:2; grid-row:1 / span 3; align-self:center; }

/* Rows */
.commentwidgetbox .lcw-row{ display:flex; align-items:center; gap:6px; min-width:0; }
.commentwidgetbox .lcw-row--head{ gap:6px; }
.commentwidgetbox .lcw-row--meta{ font-size:12px; color:#cfcfcf; }

/* Author (inline-flex so the star hugs the name) */
.commentwidgetbox .lcw-author{
  display:inline-flex;
  align-items:center;
  gap:0px;
  font-weight:700; color:#fff; text-decoration:none; white-space:nowrap;
}
.commentwidgetbox .lcw-author:hover{ color:#fff; text-decoration:underline; }

/* Official Rep badge (blue star) */
.commentwidgetbox .lcw-badge{
  display:inline-flex; align-items:center; line-height:0;
}
.commentwidgetbox .lcw-badge svg{
  width:12px; height:12px; display:block; fill:#1da1f2;
}

/* Action */
.commentwidgetbox .lcw-action{ color:#cfcfcf; flex-shrink:0; }

/* Post title */
.commentwidgetbox .lcw-post{
  font-weight:700; color:#fff; text-decoration:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;
}
.commentwidgetbox .lcw-post:hover{ color:#fff; text-decoration:underline; }

/* Rating chip */
.commentwidgetbox .lcw-rating{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 4px 10px;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 800;
  border-radius: 8px;
  color:#000;
  background:#aeb0b3;
}
.commentwidgetbox .review-rating-box--red   { background:#ff6874; }
.commentwidgetbox .review-rating-box--amber { background:#f39c12; }
.commentwidgetbox .review-rating-box--green { background:#27ae60; }

/* Excerpt */
.commentwidgetbox .lcw-excerpt{
  color:#dfdfdf; font-size:14px; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; white-space:normal; text-overflow:ellipsis;
  min-width:0; flex:1;
}

/* Likes row */
.commentwidgetbox .lcw-reactions{ display:inline-flex; align-items:center; gap:6px; }
.commentwidgetbox .lcw-heart{ font-weight:900; color:#ff6b81; line-height:1; }
.commentwidgetbox .lcw-dot{ opacity:.6; }

/* Relative time */
.commentwidgetbox .lcw-time{ white-space:nowrap; opacity:.9; }

/* Mobile */
@media (max-width:520px){
  .commentwidgetbox .lcw-tab{
    padding:8px 14px;
    font-size:14px;
  }
  .commentwidgetbox .lcw-li-style{ grid-template-columns:36px 1fr; padding:8px; }
  .commentwidgetbox .lcw-image-style{ width:36px; height:36px; }
  .commentwidgetbox .lcw-author, .commentwidgetbox .lcw-post{ font-size:15px; }
  .commentwidgetbox .lcw-rating{ font-size:14px; padding:3px 8px; }
  .commentwidgetbox .lcw-excerpt{ -webkit-line-clamp:3; }
}
/* Legend */
.commentwidgetbox .lcw-legend{
  margin: 6px 0 0;
  padding: 6px 0 0;
  border-top: 1px solid rgba(255,255,255,.06);
  font-size: 12px;
  color: #cfcfcf;
  display:flex;
  align-items:center;
}
.commentwidgetbox .lcw-legend-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.commentwidgetbox .lcw-legend-icon{
  display:inline-flex; line-height:0;
}
.commentwidgetbox .lcw-legend-icon svg{
  width:12px; height:12px; display:block; fill:#1da1f2;
}
.commentwidgetbox .lcw-legend-text{
  line-height:1;
}

/* Post Type Pill */
.commentwidgetbox .lcw-pill{
  display:inline-flex;
  align-items:center;
  padding: 1px 5px;
  font-size:10px;
  font-weight:800;
  border-radius:14px;
  text-transform:uppercase;
  letter-spacing:.4px;
  line-height:1;
  color:#000;
}

/* Bright Colors */
.commentwidgetbox .lcw-pill--review{
  background:#00d4ff;
}

.commentwidgetbox .lcw-pill--user-review{
  background:#27ae60;
}

.commentwidgetbox .lcw-pill--news{
  background:#f39c12;
}

.commentwidgetbox .lcw-pill--replay{
  background:#ff4757;
}
.commentwidgetbox .lcw-pill--tournament {
  background: #f59e0b;
}
.commentwidgetbox .lcw-replay-trophy {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  color: #facc15;
}
.commentwidgetbox .lcw-replay-trophy .fa-trophy {
  font-size: 1em;
}
.commentwidgetbox .lcw-pill--forum {
  background: #8b5cf6;
}
.commentwidgetbox .lcw-pill--user-score{
  background:#2ecc71;
}