/* ReBBu Unified Web: the news (articles.php) and the comments under an article. */

.uw-article { padding-top: 0; overflow: hidden; }
.uw-article-cover { display: block; width: calc(100% + 2 * var(--uw-pad)); max-height: 360px; object-fit: cover; margin: 0 calc(-1 * var(--uw-pad)) 28px calc(-1 * var(--uw-pad)); }
.uw-article-title { font-size: 40px; margin-top: 20px; }
.uw-article-cover + .uw-article-title { margin-top: 0; }
.uw-article-cat { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: 999px; background: var(--uw-panel-raised); font-size: 12px; text-decoration: none; }
.uw-article-summary { color: var(--uw-text); font-weight: 500; }
.uw-article-author { margin-top: 18px; color: var(--uw-muted); font-style: italic; }
.uw-article-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 14px; margin-top: 26px; }
.uw-article-gallery img { width: 100%; height: 130px; object-fit: cover; border-radius: var(--uw-radius-small); }

.uw-news-row { display: flex; gap: 22px; padding: 18px 0; text-decoration: none; }
.uw-page a.uw-news-row { color: var(--uw-text); }
.uw-news-row img { width: 200px; height: 104px; object-fit: cover; border-radius: var(--uw-radius-small); flex: none; background: var(--uw-night); }
.uw-news-row > span { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.uw-news-row:hover strong { color: var(--uw-link); }
.uw-page .uw-list a[aria-current="page"] { color: var(--uw-gold); }

/* the comments (markup of includes/news_comments.php) */
.uw-comments h3 { font: 700 15px/1.3 var(--uw-font-display); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 14px 0; color: var(--uw-text); }
.uw-comments .news-comments-list { list-style: none; margin: 0; padding: 0; }
.uw-comments .news-comment { display: flex; gap: 16px; padding: 16px 0; border-top: 1px solid var(--uw-line); background: transparent; }
.uw-comments .news-comment.staff { box-shadow: inset 3px 0 0 var(--uw-gold); padding-left: 10px; }
.uw-comments .news-comment-avatar img { image-rendering: pixelated; }
.uw-comments .news-comment-body { flex: 1; min-width: 0; }
.uw-comments .news-comment-meta { font-size: 13px; color: var(--uw-muted); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.uw-comments .news-comment-badge { padding: 1px 8px; border-radius: 999px; background: var(--uw-gold); color: #3a2600; font-size: 11px; font-weight: 700; }
.uw-comments .news-comment-text { margin-top: 4px; color: var(--uw-text); }
.uw-comments .news-comment-delete { display: inline; margin: 0; }
.uw-comments .news-comment-delete button, .uw-comments .news-comment-delete input { background: none; border: 0; color: var(--uw-muted); cursor: pointer; font-size: 12px; padding: 0; }
.uw-comments textarea, .uw-comments .news-comment-form textarea { width: 100%; box-sizing: border-box; min-height: 90px; padding: 10px 12px; border: 1px solid var(--uw-line); border-radius: 10px; background: var(--uw-night); color: var(--uw-text); font: 400 15px var(--uw-font); }
.uw-comments form:not(.news-comment-delete) button, .uw-comments form:not(.news-comment-delete) input[type=submit] { margin-top: 10px; padding: 9px 18px 11px 18px; border: 0; border-radius: var(--uw-radius-small); cursor: pointer;
	background: linear-gradient(to bottom, #ffd24d, var(--uw-gold)); color: #3a2600; font: 700 13px/1.2 var(--uw-font-display); text-transform: uppercase; letter-spacing: .03em; box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .2); }
.uw-comments .news-comments-empty, .uw-comments .news-comments-login { color: var(--uw-muted); }
.uw-comments .news-comments-ok { color: #8fe0ae; }
.uw-comments .news-comments-error { color: #ff9b9e; }

@media (max-width: 560px) {
	.uw-news-row img { width: 96px; height: 60px; }
	.uw-article-title { font-size: 26px; }
}
.uw-comments .news-comment-actions .news-comment-count { font-size: 13px; color: var(--uw-muted); }