/* ===== UNIFIED FORUM STYLES - MOBILE FIRST RESPONSIVE DESIGN ===== */
/* Csak fórum-specifikus elemek stílusozása, Bootstrap alapértelmezett osztályok érintetlenül hagyása */

/* ===== BASE FORUM CONTAINER ===== */
.forum-container {
	max-width: 100%;
	margin: 0;
	color: var(--text-primary);
}

/* ===== FORUM HEADER ===== */
.forum-header {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-sm);
	margin-bottom: var(--spacing-md);
	padding: var(--spacing-sm);
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
}

.forum-header .breadcrumb {
	margin-bottom: 0;
	background: transparent;
	padding: 0;
	font-size: 0.9rem;
}

.forum-header .breadcrumb-item a {
	color: var(--text-primary);
	transition: var(--transition-sm);
}

.forum-header .breadcrumb-item a:hover {
	color: var(--color-primary-light);
}

.forum-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-xs);
	justify-content: flex-start;
}

.forum-actions .btn {
	flex: 1;
	min-width: 120px;
	font-size: 0.85rem;
	padding: var(--spacing-xs) var(--spacing-sm);
}

/* ===== MOBILE SORT BUTTON ===== */
.mobile-sort-btn {
	display: none;
	width: 100%;
	margin-bottom: var(--spacing-sm);
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
	padding: var(--spacing-sm);
	border-radius: var(--bs-border-radius);
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 0.9rem;
	font-weight: 500;
}

.mobile-sort-btn:hover {
	background: var(--bg-accent);
	border-color: var(--border-accent);
	transform: translateY(-1px);
}

.mobile-sort-btn i {
	margin-right: var(--spacing-xs);
}

/* ===== CATEGORY STYLES ===== */
.category-container {
	margin-bottom: var(--spacing-md);
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}

.category-header {
	padding: var(--spacing-sm) var(--spacing-md);
	background: var(--bg-card-header);
	border-bottom: 1px solid var(--border-primary);
	cursor: pointer;
	user-select: none;
	transition: background-color 0.2s ease;
}

.category-header:hover {
	background: var(--bg-accent);
}

.category-info {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.category-name {
	font-size: 1.1rem;
	font-weight: 600;
	margin: 0;
	color: var(--text-primary);
	display: flex;
	align-items: center;
	gap: var(--spacing-sm);
}

.category-toggle {
	color: var(--text-primary);
	font-size: 0.8rem;
	transition: transform 0.2s ease;
}

/* ===== FORUM LIST ===== */
.forum-list {
	transition: max-height 0.3s ease, opacity 0.2s ease;
	overflow: hidden;
}

.forum-list.collapsed {
	max-height: 0;
	opacity: 0;
}

.forum-list:not(.collapsed) {
	max-height: none;
	opacity: 1;
}

/* ===== FORUM ITEM STYLES (Mobile First) ===== */
.forum-item {
	display: flex;
	flex-direction: column;
	padding: var(--spacing-md);
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-tertiary);
	transition: background-color 0.2s ease, transform 0.1s ease;
	position: relative;
	gap: var(--spacing-sm);
}

.forum-item:last-child {
	border-bottom: none;
}

.forum-item:hover {
	background: var(--bg-accent);
	transform: translateX(2px);
}

.forum-item.forum-unread {
	border-left: 3px solid var(--text-primary);
	background: rgba(var(--text-primary-rgb), 0.05);
}

/* Forum item layout - mobile first */
.forum-main {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
}

.forum-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0;
	line-height: 1.3;
}

.forum-title a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.forum-title a:hover {
	color: var(--text-primary-hover);
}

.forum-description {
	font-size: 0.85rem;
	color: var(--text-secondary);
	margin: 0;
	line-height: 1.4;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.forum-meta {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
	font-size: 0.8rem;
	color: var(--bs-breadcrumb-item-active-color);
}

.forum-stats {
	display: flex;
	gap: var(--spacing-sm);
	flex-wrap: wrap;
	align-items: center;
}

.forum-stats i {
	color: var(--text-primary);
	margin-right: 2px;
}

/* Javított last-activity: több térköz és jobb elhelyezés */
.last-activity {
	text-align: left;
	font-size: 0.75rem;
	padding: var(--spacing-xs);
	margin: var(--spacing-xs) 0;
	border-radius: var(--bs-border-radius);
	max-width: 200px;
	word-wrap: break-word;
}

.last-time {
	color: var(--text-muted);
	margin-bottom: 4px;
	font-weight: 500;
}

.last-topic {
	margin-bottom: 4px;
}

.last-topic a {
	color: var(--text-primary);
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 500;
	transition: color 0.2s ease;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.last-topic a:hover {
	text-decoration: underline;
	color: var(--text-primary-hover);
}

.last-user a {
	color: var(--text-primary);
	text-decoration: none;
	font-size: 0.75rem;
	transition: color 0.2s ease;
}

.last-user a:hover {
	text-decoration: underline;
	color: var(--color-primary-light);
}

.no-activity {
	color: var(--text-muted);
	font-size: 0.75rem;
	font-style: italic;
}

/* ===== TOPIC STYLES ===== */
.topic-item {
	display: flex;
	flex-direction: column;
	padding: var(--spacing-md);
	border-bottom: 1px solid var(--border-primary);
	background: var(--bg-tertiary);
	transition: background-color 0.2s ease, transform 0.1s ease;
	gap: var(--spacing-sm);
	position: relative;
}

.topic-item:last-child {
	border-bottom: none;
}

.topic-item:hover {
	background: var(--bg-accent);
	transform: translateX(2px);
}

.topic-item.topic-unread {
	border-left: 3px solid var(--bs-success);
	background: rgba(var(--bs-success-rgb), 0.05);
}

.topic-item.topic-sticky {
	border-left: 4px solid var(--bs-warning);
	background: var(--bs-warning-bg-subtle);
	border: 1px solid var(--bs-warning-border-subtle);
	font-weight: 600;
}

.topic-item.topic-locked {
	border-left: 3px solid var(--bs-danger);
	opacity: 0.8;
	background: rgba(var(--bs-danger-rgb), 0.03);
}

.topic-main {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
}

.topic-header {
	display: flex;
	align-items: flex-start;
	gap: var(--spacing-sm);
}

.topic-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0;
	line-height: 1.3;
	flex: 1;
}

.topic-title a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.topic-title a:hover {
	color: var(--text-primary);
}

.topic-badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-xs);
}

.topic-author {
	font-size: 0.8rem;
	color: var(--text-secondary);
}

.topic-author a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.topic-author a:hover {
	color: var(--color-primary-light);
}

.topic-meta {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
	font-size: 0.8rem;
	color: var(--text-muted);
}

.topic-stats {
	display: flex;
	gap: var(--spacing-sm);
	flex-wrap: wrap;
	align-items: center;
}

.topic-stats i {
	color: var(--text-primary);
	margin-right: 2px;
}

/* ===== POST STYLES ===== */
.posts-container {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-md);
}

.post-item {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: box-shadow 0.2s ease;
}

.post-item:hover {
	box-shadow: var(--shadow-md);
}

.post-item.first-post {
	border: 2px solid var(--bg-primary);
	box-shadow: var(--shadow-md);
}

.post-header {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-sm);
	padding: var(--spacing-md);
	background: var(--bg-card-header);
	border-bottom: 1px solid var(--border-primary);
}

.post-author {
	display: flex;
	gap: var(--spacing-sm);
	align-items: flex-start;
}

.author-avatar img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--border-primary);
	transition: transform 0.2s ease, border-color 0.2s ease;
}

.author-avatar img:hover {
	transform: scale(1.05);
	border-color: var(--text-primary);
}

.author-info {
	flex: 1;
	min-width: 0;
}

.author-name {
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 var(--spacing-sm) 0; /* Nagyobb távolság az author-stats-tól */
}

.author-name a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.author-name a:hover {
	color: var(--text-primary);
}

.author-title {
	font-size: 0.75rem;
	color: var(--text-primary);
	margin-bottom: var(--spacing-sm); /* Nagyobb távolság */
	font-weight: 500;
}

.author-stats {
	font-size: 0.7rem;
	color: var(--text-muted);
	margin-top: var(--spacing-sm); /* Nagyobb távolság az author-name-től */
}

.author-stats a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.author-stats a:hover {
	color: var(--text-primary);
}

.post-info {
	text-align: right;
	font-size: 0.75rem;
	color: var(--text-muted);
}

.post-date {
	font-weight: 500;
	color: var(--text-secondary);
}

.post-number {
	color: var(--text-primary);
	font-weight: 600;
	margin-top: 2px;
}

.post-content {
	padding: var(--spacing-md);
}

.post-body {
	line-height: 1.6;
	word-wrap: break-word;
	overflow-wrap: break-word;
	color: var(--text-primary);
}

.post-body p {
	margin-bottom: 1rem;
}

.post-body p:last-child {
	margin-bottom: 0;
}

/* Szerkesztési előzmények stílusai */
.edit-history {
	margin-top: var(--spacing-md);
	padding-top: var(--spacing-sm);
	border-top: 1px solid var(--border-primary);
}

.edit-entry {
	padding: var(--spacing-sm);
	background: var(--bg-tertiary);
	border-radius: var(--bs-border-radius);
}

.edit-meta {
	margin-bottom: var(--spacing-xs);
}

.edit-content {
	font-size: 0.9rem;
	line-height: 1.4;
	color: var(--text-secondary);
	padding: var(--spacing-xs);
	background: var(--bg-secondary);
	border-radius: var(--bs-border-radius);
	border-left: 3px solid var(--border-accent);
}

.post-signature {
	margin-top: var(--spacing-md);
	padding-top: var(--spacing-sm);
	border-top: 1px solid var(--border-primary);
	font-size: 0.85rem;
	color: var(--text-secondary);
	font-style: italic;
}

.post-footer {
	padding: var(--spacing-sm) var(--spacing-md);
	background: var(--bg-tertiary);
	border-top: 1px solid var(--border-primary);
	display: flex;
	flex-direction: column;
	gap: var(--spacing-sm);
}

.post-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-xs);
}

.post-reactions {
	display: flex;
	justify-content: center;
	gap: var(--spacing-xs);
}

/* Javított reakció gombok látványosabb visszajelzéssel */
.reaction-btn {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
	padding: var(--spacing-xs) var(--spacing-sm);
	border-radius: var(--bs-border-radius);
	cursor: pointer;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: var(--spacing-xs);
	font-size: 0.8rem;
	font-weight: 500;
	position: relative;
	overflow: hidden;
}

.reaction-btn:hover {
	background: var(--bg-accent);
	border-color: var(--border-accent);
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.reaction-btn.active.positive {
	background: linear-gradient(135deg, var(--bs-success), #43a047);
	border-color: var(--bs-success);
	color: white;
	box-shadow: 0 0 20px rgba(76, 175, 80, 0.4);
	transform: scale(1.05);
}

.reaction-btn.active.negative {
	background: linear-gradient(135deg, var(--bs-danger), #e53935);
	border-color: var(--bs-danger);
	color: white;
	box-shadow: 0 0 20px rgba(244, 67, 54, 0.4);
	transform: scale(1.05);
}

/* Speciális animáció a felhasználó által értékelt gombokhoz */
.reaction-btn.user-reacted {
	animation: reactionPulse 2s infinite;
}

@keyframes reactionPulse {
	0% {
		box-shadow: 0 0 0 0 rgba(104, 181, 255, 0.7);
	}
	70% {
		box-shadow: 0 0 0 10px rgba(104, 181, 255, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(104, 181, 255, 0);
	}
}

.reaction-btn.user-reacted.positive {
	animation: reactionPulseGreen 2s infinite;
}

.reaction-btn.user-reacted.negative {
	animation: reactionPulseRed 2s infinite;
}

@keyframes reactionPulseGreen {
	0% {
		box-shadow: 0 0 0 0 rgba(76, 175, 80, 0.7);
	}
	70% {
		box-shadow: 0 0 0 10px rgba(76, 175, 80, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
	}
}

@keyframes reactionPulseRed {
	0% {
		box-shadow: 0 0 0 0 rgba(244, 67, 54, 0.7);
	}
	70% {
		box-shadow: 0 0 0 10px rgba(244, 67, 54, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(244, 67, 54, 0);
	}
}

/* Kiemelő effekt amikor a felhasználó rákattint */
.reaction-btn:active {
	transform: scale(0.95);
}

.reaction-btn.user-reacted:before {
	content: "✓";
	position: absolute;
	top: -5px;
	right: -5px;
	background: var(--bs-success);
	color: white;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	font-size: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* ===== PAGINATION ===== */
.forum-pagination {
	margin-top: var(--spacing-lg);
	padding: var(--spacing-md);
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
}

/* Bootstrap pagination megtartása, csak wrapper stílusozása */

/* ===== FORUM STATISTICS - border és box-shadow eltávolítva ===== */
.forum-stats {
	margin-top: var(--spacing-lg);
	overflow: hidden;
}

.forum-stats-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	background: var(--bg-secondary);
	border-radius: var(--bs-border-radius);
}

.stat-item {
	padding: var(--spacing-md);
	text-align: center;
	border-bottom: 1px solid var(--border-primary);
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.1s ease;
	background: var(--bg-tertiary);
}

.stat-item:last-child {
	border-bottom: none;
}

.stat-item:hover {
	background: var(--bg-accent);
	transform: translateY(-2px);
}

.stat-number {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-primary);
	line-height: 1;
	margin-bottom: var(--spacing-xs);
	font-family: var(--bs-font-monospace);
}

.stat-label {
	font-size: 0.8rem;
	color: var(--text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	font-weight: 600;
}

/* ===== MOBILE SORT MODAL ===== */
.mobile-sort-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(var(--bs-black-rgb), 0.8);
	z-index: 1050;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--spacing-md);
	backdrop-filter: blur(4px);
}

.mobile-sort-content {
	background: var(--bg-modal);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	width: 100%;
	max-width: 400px;
	max-height: 80vh;
	overflow-y: auto;
	box-shadow: var(--shadow-xl);
}

.mobile-sort-header {
	padding: var(--spacing-md);
	border-bottom: 1px solid var(--border-primary);
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: var(--bg-card-header);
}

.mobile-sort-header h4 {
	margin: 0;
	color: var(--text-primary);
	font-size: 1.1rem;
}

.mobile-sort-body {
	padding: var(--spacing-md);
}

.mobile-sort-footer {
	padding: var(--spacing-md);
	border-top: 1px solid var(--border-primary);
	text-align: center;
	background: var(--bg-tertiary);
}

.mobile-sort-list {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-xs);
}

.mobile-sort-item {
	padding: var(--spacing-sm) var(--spacing-md);
	background: var(--bg-tertiary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mobile-sort-item:hover {
	background: var(--bg-accent);
	border-color: var(--border-accent);
	transform: translateX(2px);
}

.mobile-sort-item.active {
	background: var(--text-primary);
	border-color: var(--text-primary);
	color: white;
}

.mobile-sort-item.sub-item {
	margin-left: var(--spacing-md);
	background: var(--bg-secondary);
	border-style: dashed;
}

.mobile-sort-item .item-info {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.mobile-sort-item .item-type {
	font-size: 0.8rem;
	color: var(--text-secondary);
	font-style: italic;
}

.mobile-sort-item .sort-controls {
	display: flex;
	gap: var(--spacing-xs);
}

.mobile-sort-item .sort-controls .btn {
	padding: 0.25rem 0.5rem;
	font-size: 0.8rem;
	min-width: auto;
}

/* ===== LOADING OVERLAY ===== */
.forum-loading-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(var(--bs-black-rgb), 0.7);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
	backdrop-filter: blur(2px);
}

.forum-loading {
	text-align: center;
	padding: 2rem;
}

/* ===== ADMIN CONTROLS ===== */
.forum-admin,
.topic-admin {
	display: flex;
	gap: var(--spacing-xs);
	margin-top: var(--spacing-sm);
}

.forum-admin .btn,
.topic-admin .btn {
	padding: var(--spacing-xs);
	min-width: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* ===== TOPIC INFO SECTION ===== */
.topic-info {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	padding: var(--spacing-md);
	margin-bottom: var(--spacing-lg);
	box-shadow: var(--shadow-sm);
}

.topic-info .topic-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: var(--spacing-sm);
	color: var(--text-primary);
	line-height: 1.3;
}

.topic-info .topic-meta {
	font-size: 0.9rem;
	color: var(--text-secondary);
}

.topic-info .topic-meta a {
	color: var(--text-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.topic-info .topic-meta a:hover {
	color: var(--color-primary-light);
}

/* ===== CUSTOM MODAL STYLES ===== */
.custom-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1050;
	display: flex;
	align-items: center;
	justify-content: center;
}

.custom-modal .modal-backdrop {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(2px);
}

.custom-modal .modal-dialog {
	position: relative;
	z-index: 1051;
	max-width: 500px;
	width: 90%;
	max-height: 90vh;
	overflow-y: auto;
}

.custom-modal .modal-content {
	background: var(--bg-primary);
	border: 1px solid var(--border-primary);
	border-radius: var(--bs-border-radius);
	box-shadow: var(--shadow-xl);
}

.custom-modal .modal-header {
	padding: var(--spacing-md);
	border-bottom: 1px solid var(--border-primary);
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: var(--bg-card-header);
}

.custom-modal .modal-title {
	margin: 0;
	color: var(--text-primary);
	font-size: 1.1rem;
	font-weight: 600;
}

.custom-modal .btn-close {
	background: none;
	border: none;
	font-size: 1.5rem;
	cursor: pointer;
	color: var(--text-secondary);
	padding: 0;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--bs-border-radius);
	transition: all 0.2s ease;
}

.custom-modal .btn-close:hover {
	color: var(--text-primary);
	background: var(--bg-accent);
}

.custom-modal .btn-close::before {
	content: '×';
}

.custom-modal .modal-body {
	padding: var(--spacing-md);
}

.custom-modal .modal-footer {
	padding: var(--spacing-md);
	border-top: 1px solid var(--border-primary);
	display: flex;
	gap: var(--spacing-sm);
	justify-content: flex-end;
	background: var(--bg-tertiary);
}

/* Form-specific styling only for custom modals */
.custom-modal .form-label {
	color: var(--text-primary);
	font-weight: 500;
	margin-bottom: var(--spacing-xs);
	display: block;
}

.custom-modal .form-control {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	color: var(--text-primary);
	border-radius: var(--bs-border-radius);
	padding: var(--spacing-sm);
	width: 100%;
	font-size: 0.9rem;
	transition: all 0.2s ease;
}

.custom-modal .form-control:focus {
	border-color: var(--text-primary);
	box-shadow: 0 0 0 0.2rem rgba(var(--text-primary-rgb), 0.25);
	outline: 0;
	background: var(--bg-primary);
}

.custom-modal .form-check-input {
	background: var(--bg-secondary);
	border: 1px solid var(--border-primary);
	width: 1em;
	height: 1em;
	margin-top: 0.25em;
	vertical-align: top;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border-radius: 0.25em;
	appearance: none;
	transition: all 0.2s ease;
}

.custom-modal .form-check-input:checked {
	background-color: var(--text-primary);
	border-color: var(--text-primary);
}

.custom-modal .form-check-label {
	color: var(--text-primary);
	cursor: pointer;
	margin-left: 0.5rem;
}

/* Custom button styling only for non-Bootstrap context */
.custom-modal .btn:not([class*="btn-"]) {
	padding: var(--spacing-sm) var(--spacing-md);
	border-radius: var(--bs-border-radius);
	font-size: 0.9rem;
	border: 1px solid var(--border-primary);
	background: var(--bg-secondary);
	color: var(--text-primary);
	cursor: pointer;
	transition: all 0.2s ease;
	font-weight: 500;
	text-decoration: none;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	user-select: none;
}

.custom-modal .btn:not([class*="btn-"]):hover {
	background: var(--bg-accent);
	border-color: var(--text-primary);
	color: var(--text-primary);
	transform: translateY(-1px);
}

/* ===== REACTIONS ===== */
.reactions {
	display: flex;
	gap: var(--spacing-xs);
	align-items: center;
}

/* ===== LOAD MORE CONTAINER ===== */
.load-more-container {
	text-align: center;
	padding: var(--spacing-md);
	margin: var(--spacing-md) 0;
}

.load-more-spinner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-sm);
}

.load-more-spinner p {
	margin: 0;
	color: var(--text-secondary);
	font-size: 0.9rem;
}

/* ===== DROPDOWN JAVÍTÁS - Jobb elérhetőség ===== */
.dropdown-menu {
	z-index: 1055 !important;
	min-width: 160px;
	padding: 0.5rem 0;
	background: var(--bg-card);
	border: 1px solid var(--border-card);
	border-radius: var(--bs-border-radius);
	box-shadow: var(--shadow-card);
}

.dropdown-item {
	padding: 0.5rem 1rem;
	color: var(--text-primary);
	text-decoration: none;
	background: transparent;
	border: none;
	width: 100%;
	text-align: left;
	transition: all 0.2s ease;
}

.dropdown-item:hover,
.dropdown-item:focus {
	background: var(--hover-dropdown) !important;
	color: var(--text-primary) !important;
}

.dropdown-toggle::after {
	margin-left: 0.5rem;
}

/* ===== RESPONSIVE BREAKPOINTS ===== */

/* Show mobile sort button on small screens */
@media (max-width: 768px) {
	.mobile-sort-btn {
		display: block;
	}
	
	/* Improve mobile spacing */

	
	.forum-header {
		padding: var(--spacing-sm);
	}
	
	.forum-actions .btn {
		font-size: 0.8rem;
		padding: var(--spacing-xs);
		flex: 1;
		min-width: 100px;
	}
	
	.forum-actions {
		flex-direction: column;
	}
	
	.stat-number {
		font-size: 1.25rem;
	}
	
	.stat-label {
		font-size: 0.75rem;
	}
	
	.post-footer {
		flex-direction: column;
		gap: var(--spacing-sm);
	}
	
	.post-reactions {
		justify-content: center;
	}
	
	.topic-badges {
		width: 100%;
		margin-top: 0.5rem;
	}
	
	.custom-modal .modal-dialog {
		margin: 1rem;
		max-width: calc(100% - 2rem);
	}
	
	.custom-modal .modal-header,
	.custom-modal .modal-body,
	.custom-modal .modal-footer {
		padding: var(--spacing-sm);
	}
	
	.mobile-sort-content {
		width: 95%;
		max-height: 90vh;
	}

	.last-activity {
		max-width: 100%;
	}
}

/* Tablet optimizations */
@media (min-width: 769px) and (max-width: 1024px) {
	.forum-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.forum-item,
	.topic-item {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--spacing-md);
	}
	
	.forum-main,
	.topic-main {
		flex: 1;
		min-width: 0;
	}
	
	.last-activity {
		text-align: right;
		min-width: 140px;
		max-width: 160px;
	}
	
	.post-footer {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	
	.post-actions {
		flex: 1;
	}
	
	.post-reactions {
		justify-content: flex-end;
	}
}

/* Desktop optimizations */
@media (min-width: 1025px) {
	.forum-container {
		max-width: 1200px;
		margin: 0 auto;
	}
	
	.forum-header {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: var(--spacing-md) var(--spacing-lg);
	}
	
	.forum-actions .btn {
		flex: none;
		min-width: auto;
		font-size: 0.9rem;
		padding: var(--spacing-sm) var(--spacing-md);
	}
	
	.forum-stats-grid {
		grid-template-columns: repeat(3, 1fr);
	}
	
	.stat-item {
		border-right: 1px solid var(--border-primary);
		border-bottom: none;
	}
	
	.stat-item:last-child {
		border-right: none;
	}
	
	/* Desktop forum/topic layout */
	.forum-item,
	.topic-item {
		flex-direction: row;
		align-items: center;
		gap: var(--spacing-lg);
		padding: var(--spacing-md) var(--spacing-lg);
	}
	
	.forum-left,
	.topic-left {
		flex-shrink: 0;
		width: 48px;
		display: flex;
		justify-content: center;
	}
	
	.forum-icon,
	.topic-icon {
		width: 36px;
		height: 36px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: var(--bg-accent);
		color: var(--text-primary);
		font-size: 1.1rem;
		transition: all 0.2s ease;
	}
	
	.forum-icon:hover,
	.topic-icon:hover {
		background: var(--text-primary);
		color: white;
		transform: scale(1.1);
	}
	
	.forum-center,
	.topic-center {
		flex: 1;
		min-width: 0;
	}
	
	.forum-main,
	.topic-main {
		margin-bottom: var(--spacing-xs);
	}
	
	.forum-meta,
	.topic-meta {
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
	}
	
	.forum-right,
	.topic-right {
		flex-shrink: 0;
		width: 180px;
		text-align: right;
	}
	
	.last-activity {
		max-width: 180px;
		text-align: right;
	}
	
	.post-header {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	
	.post-footer {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	
	.post-actions {
		flex: 1;
	}
	
	.post-reactions {
		justify-content: flex-end;
	}
	
	/* Enable drag and drop cursor for desktop */
	.forum-item.draggable-item,
	.topic-item.draggable-item {
		cursor: grab;
	}
	
	.forum-item.draggable-item:active,
	.topic-item.draggable-item:active {
		cursor: grabbing;
	}
}

/* Large desktop optimizations */
@media (min-width: 1400px) {
	.forum-container {
		max-width: 1400px;
	}
	
	.forum-right,
	.topic-right {
		width: 200px;
	}
	
	.last-activity {
		max-width: 200px;
	}
	
	.author-avatar img {
		width: 48px;
		height: 48px;
	}
}

/* ===== DRAGGING STATES (Desktop Only) ===== */
@media (min-width: 769px) {
	.sortable-ghost {
		opacity: 0.4;
		background: var(--bg-highlight) !important;
	}
	
	.sortable-chosen {
		background: var(--bg-accent) !important;
	}
	
	.sortable-drag {
		transform: rotate(2deg);
		box-shadow: 0 8px 25px rgba(var(--bs-black-rgb), 0.3);
	}
}

/* ===== ACCESSIBILITY IMPROVEMENTS ===== */
@media (prefers-reduced-motion: reduce) {
	.forum-item,
	.topic-item,
	.post-item,
	.category-header,
	.mobile-sort-item,
	.reaction-btn,
	.author-avatar img,
	.forum-icon,
	.topic-icon {
		transition: none;
	}
	
	.category-toggle {
		transition: none;
	}
	
	.reaction-btn.user-reacted {
		animation: none;
	}
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	.forum-item,
	.topic-item,
	.post-item {
		border-width: 2px;
	}
	
	.forum-item.forum-unread,
	.topic-item.topic-unread {
		border-left-width: 4px;
	}
}

/* ===== PRINTING SUPPORT ===== */
@media print {
	.forum-actions,
	.mobile-sort-btn,
	.post-actions,
	.topic-admin,
	.forum-admin,
	.post-reactions {
		display: none !important;
	}
	
	.forum-container {
		background: white !important;
		color: black !important;
		box-shadow: none !important;
	}
	
	.post-item,
	.forum-item,
	.topic-item {
		border: 1px solid #ccc !important;
		page-break-inside: avoid;
	}
}

/* ===== TOUCH IMPROVEMENTS FOR MOBILE ===== */
@media (hover: none) and (pointer: coarse) {
	.forum-item,
	.topic-item,
	.mobile-sort-item {
		min-height: 44px;
		display: flex;
		align-items: center;
	}
}

/* ===== SCROLL BEHAVIOR ===== */
html {
	scroll-behavior: smooth;
}

.forum-content {
	scroll-behavior: smooth;
}