/* DanhBaAI Content Engine — feed tin kiểu SAI News, hợp style Rehub */
.dbai-layout { display: grid; grid-template-columns: minmax(240px, 300px) minmax(0, 860px); gap: 40px; align-items: start; justify-content: center; }
body.noinnerpadding .dbai-layout { padding-top: 30px; }
.dbai-layout.dbai-layout-no-sidebar { grid-template-columns: minmax(0, 860px); }
.dbai-feed { width: 100%; max-width: 860px; margin: 0; min-width: 0; }
.dbai-sidebar.sidebar { float: none; width: 100%; margin: 0; }
.dbai-sidebar .widget { margin-bottom: 26px; }
.dbai-toolbar { display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #e7e9ee; }
.dbai-tabs { display: flex; gap: 8px; }
.dbai-tab { display: inline-block; border: 1px solid #e0e3ea; background: #fff; padding: 8px 16px; border-radius: 20px; cursor: pointer; font-size: 14px; line-height: 1.4; font-weight: 600; color: #555; text-decoration: none; transition: all .15s; }
.dbai-tab:hover { border-color: #bbb; }
.dbai-tab.active { background: #222; color: #fff; border-color: #222; }
.dbai-filters { display: flex; gap: 8px; }
.dbai-select { border: 1px solid #e0e3ea; border-radius: 8px; padding: 7px 10px; font-size: 13px; background: #fff; color: #444; cursor: pointer; }
.dbai-filter-submit { border: 1px solid #222; border-radius: 8px; padding: 7px 12px; background: #222; color: #fff; font-size: 13px; font-weight: 700; cursor: pointer; }
.dbai-filter-submit:hover { background: #ff7a2f; border-color: #ff7a2f; }

.dbai-item { display: flex; gap: 14px; padding: 16px 4px; border-bottom: 1px solid #f0f1f5; }
.dbai-item:hover { background: #fafbfd; }

.dbai-vote-col { display: flex; flex-direction: column; align-items: center; min-width: 40px; padding-top: 2px; }
.dbai-vote { border: 1px solid #e0e3ea; background: #fff; border-radius: 8px; width: 34px; height: 30px; cursor: pointer; color: #888; font-size: 13px; line-height: 1; transition: all .15s; }
.dbai-vote:hover { border-color: #ff7a2f; color: #ff7a2f; }
.dbai-vote.voted { background: #fff3ec; border-color: #ff7a2f; color: #ff7a2f; cursor: default; }
.dbai-vote-count { font-size: 12px; font-weight: 700; color: #666; margin-top: 4px; }

.dbai-wishlist-col { display: flex; justify-content: center; width: 34px; margin-top: 8px; }
.dbai-wishlist-col .heart_thumb_wrap { display: flex; flex-direction: column; align-items: center; width: 100%; margin: 0; line-height: 1; }
.dbai-wishlist-col .cell_wishlist { display: block; line-height: 1; }
.dbai-wishlist-col .heartplus { display: grid; place-items: center; width: 34px; height: 30px; margin: 0; border: 1px solid #e0e3ea; border-radius: 8px; color: #888; font-size: 17px; line-height: 1; transition: all .15s; }
.dbai-wishlist-col .heartplus:before { line-height: 1; }
.dbai-wishlist-col .heartplus:hover { border-color: #cc0000; color: #cc0000; }
.dbai-wishlist-col .heartplus.alreadywish { border-color: #cc0000; background: #fff2f2; }
.dbai-wishlist-col .thumbscount { display: block; margin: 4px 0 0; color: #666; font-size: 12px; font-weight: 700; line-height: 1; text-align: center; }

.dbai-body { flex: 1; min-width: 0; }
.dbai-meta-top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 12px; margin-bottom: 5px; }
.dbai-badge { background: #eef1f6; color: #4a5568; padding: 2px 9px; border-radius: 10px; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .3px; }
.dbai-badge-github-trending { background: #24292f; color: #fff; }
.dbai-badge-hacker-news { background: #ff6600; color: #fff; }
.dbai-badge-openai, .dbai-badge-anthropic, .dbai-badge-google-ai { background: #dce9ff; color: #1a4fb3; }
.dbai-topic { color: #7a56c2; font-weight: 600; }
.dbai-points { color: #e0731d; font-weight: 700; }
.dbai-points.dbai-up { color: #1a9c53; }
.dbai-time { color: #98a0ae; }
.dbai-title { margin: 0 0 6px !important; font-size: 17px; line-height: 1.4; }
.dbai-title a { color: #1c2330; text-decoration: none; }
.dbai-title a:hover { color: #ff7a2f; }
.dbai-summary { margin: 0 0 6px !important; font-size: 14px; line-height: 1.55; color: #5b6472; }
.dbai-summary-vi { color: #424b59; }
.dbai-summary-source { font-style: italic; }
.dbai-use-case { margin: 0 0 9px !important; font-size: 13.5px; line-height: 1.5; color: #667080; }
.dbai-use-case strong { color: #394150; }
.dbai-source-link { display: block; width: max-content; max-width: 100%; margin: 8px 0 0 auto; text-align: right; font-size: 13px; font-weight: 600; color: #ff7a2f; text-decoration: none; }
.dbai-source-link:hover { text-decoration: underline; }

.dbai-rank { min-width: 34px; font-size: 20px; font-weight: 800; color: #c3c9d4; text-align: center; padding-top: 2px; }
.dbai-repo-item .dbai-title a { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 15.5px; }
.dbai-lang { display: inline-flex; align-items: center; gap: 5px; color: #5b6472; font-weight: 600; }
.dbai-lang-dot { width: 10px; height: 10px; border-radius: 50%; background: #3572A5; display: inline-block; }
.dbai-trending-note { font-size: 12.5px; color: #98a0ae; margin-bottom: 8px; }

.dbai-pagination { padding: 24px 0 6px; }
.dbai-pagination .page-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin: 0; padding: 0; list-style: none; }
.dbai-pagination .page-numbers li { margin: 0; padding: 0; list-style: none; }
.dbai-pagination a.page-numbers,
.dbai-pagination span.page-numbers { display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 10px; border: 1px solid #e0e3ea; border-radius: 8px; background: #fff; color: #444; font-size: 14px; font-weight: 700; line-height: 1; text-decoration: none; }
.dbai-pagination a.page-numbers:hover { border-color: #ff7a2f; color: #ff7a2f; }
.dbai-pagination span.page-numbers.current { border-color: #ff7a2f; background: #ff7a2f; color: #fff; }
.dbai-empty { color: #98a0ae; text-align: center; padding: 30px 0; }
.dbai-loading { opacity: .45; pointer-events: none; }

@media (max-width: 1024px) {
	.dbai-layout { grid-template-columns: minmax(220px, 270px) minmax(0, 1fr); gap: 24px; }
}

@media (max-width: 800px) {
	.dbai-layout { grid-template-columns: minmax(0, 1fr); }
	.dbai-feed { order: 1; max-width: none; }
	.dbai-sidebar.sidebar { order: 2; }
}

@media (max-width: 600px) {
	body.noinnerpadding .dbai-layout { padding-top: 20px; }
	.dbai-toolbar { flex-direction: column; align-items: stretch; }
	.dbai-filters { justify-content: flex-start; }
	.dbai-title { font-size: 15.5px; }
	.dbai-item { gap: 10px; }
	.dbai-vote-col { min-width: 34px; }
	.dbai-wishlist-col { width: 30px; }
	.dbai-wishlist-col .heartplus { width: 30px; }
}
