/*
// 功能：后台管理样式文件
// 作者：启肯科技
// Q Q：328493711
// 微信：13738373177（同手机）
// 官网：http://www.qiken.com
// 说明：QKCMS-轻量级AI智能内容管理建站系统
// 版权：© 2025 温州启肯网络有限公司 保留所有权利，盗版必究。
*/

:root {
 --primary-color: #7c3aed;
 --primary-light: #7c3aed26;
 --primary-dark: #6d28d9;
 --primary-opacity-10: rgba(124, 58, 237, 0.1);
 --primary-opacity-20: rgba(124, 58, 237, 0.2);
 --text-primary: #333;
 --text-secondary: #666;
 --border-color: #e0e0e0;
 --background-color: #fff;
 --bg-tertiary: #f3f4f6;
 --success-color: #10b981;
 --danger-color: #ef4444;
 --text-color: var(--text-primary);
 --toast-bg: rgba(0, 0, 0, 0.75);
}
 @supports (color: color-mix(in srgb, red, blue)) {
	:root {
 --primary-light: color-mix(in srgb, var(--primary-color), transparent 85%);
 --primary-dark: color-mix(in srgb, var(--primary-color), black 10%);
 --primary-opacity-10: color-mix(in srgb, var(--primary-color), transparent 90%);
 --primary-opacity-20: color-mix(in srgb, var(--primary-color), transparent 80%);
}
}
 input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active, input:-internal-autofill-selected {
 -webkit-box-shadow: 0 0 0 30px white inset !important;
 -webkit-text-fill-color: inherit !important;
 transition: background-color 5000s ease-in-out 0s !important;
 background-color: white !important;
 background-image: none !important;
}
.text-danger {
	color: var(--danger-color);
}
.footer {
	text-align: center;
	padding: 0px;
	color: var(--text-secondary);
	font-size: 14px;
	color: #888;
	width: calc(100% - 200px);
	margin-left: 200px;
	position: relative;
	z-index: 999;
	background-color: #f8fafc;
	margin-bottom: 0;
	padding-bottom: 0;
	height: 50px;
	line-height: 50px;
}
.footer a {
	color: #888;
	text-decoration: none
}
.footer a:hover {
	color: var(--primary-color)
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
 [contenteditable="true"] {
 cursor: text;
}
[contenteditable="true"]:focus {
	box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2) !important;
	border-color: #4f46e5 !important;
	outline: none;
}
.form-group {
	position: relative;
}
body {
	font-family: 'Microsoft YaHei', 'SimSun', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	color: var(--text-color);
	background-color: var(--background-color);
	line-height: 1.6;
	overflow-y: scroll;
}
.btn {
	padding: 10px 18px;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	text-decoration: none;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
	letter-spacing: 0.3px;
}
.section-header {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: none;
	height: 40px;
	line-height: 40px;
}
.section-header .btn-danger, .section-header .btn-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	height: 46px;
	line-height: 46px;
	padding: 0 16px;
}
.section-header .btn-primary {
	margin-left: 8px;
}
.action-button {
	width: 128px;
	height: 46px;
	padding: 0;
	line-height: 46px;
	font-size: 14px;
	font-weight: 600;
	background-color: var(--primary-color);
	color: white;
	border-radius: 5px;
	text-decoration: none;
	transition: all 0.3s ease;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	display: inline-block;
	position: relative;
	z-index: 0;
	border: 0px solid rgba(0, 0, 0, 0.1);
	text-align: center;
}
.action-button:hover {
	background-color: var(--primary-dark);
	transform: translateY(-1px);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.btn-primary {
	background-color: var(--primary-color);
	color: white;
	display: inline-block;
	position: relative;
}
.btn-primary:hover {
	background-color: var(--primary-dark);
	border-color: var(--primary-dark);
	transform: translateY(-1px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
 filter: alpha(opacity:100);
	opacity: 1;
}
.btn-secondary {
	background-color: #6b7280;
	color: white;
}
.btn-secondary:hover {
	background-color: #5a6268;
	border-color: #5a6268;
	transform: translateY(-1px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.btn-danger {
	background-color: var(--danger-color);
	color: white;
}
.btn-danger:hover {
	background-color: #c82333;
	border-color: #c82333;
	transform: translateY(-1px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.btn-form #submit-button,
.btn-form #preview-button,
.btn-form #cancel-button,
.btn-form #continue-publish-button,
#goods-form #submit-button,
#goods-form #preview-button,
#goods-form #cancel-button,
#goods-form #continue-publish-button {
	border-radius: 3px;
	transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

#goods-form #submit-button {
	background-color: #3b82f6;
	border-color: #3b82f6;
}

#goods-form #submit-button:hover {
	background-color: #2563eb;
	border-color: #2563eb;
}

#goods-form #submit-button:focus {
	box-shadow: 0 0 0 3px rgba(59, 130, 246, .25);
}

#goods-form #preview-button {
	background-color: #10b981;
	border-color: #10b981;
}

#goods-form #preview-button:hover {
	background-color: #059669;
	border-color: #059669;
}

#goods-form #preview-button:focus {
	box-shadow: 0 0 0 3px rgba(16, 185, 129, .25);
}

#goods-form #cancel-button {
	background-color: #64748b;
	border-color: #64748b;
	color: #fff;
}

#goods-form #cancel-button:hover {
	background-color: #475569;
	border-color: #475569;
	color: #fff;
}

#goods-form #cancel-button:focus {
	box-shadow: 0 0 0 3px rgba(100, 116, 139, .25);
}

#goods-form #continue-publish-button {
	background-color: #8b5cf6;
	border-color: #8b5cf6;
}

#goods-form #continue-publish-button:hover {
	background-color: #7c3aed;
	border-color: #7c3aed;
}

#goods-form #continue-publish-button:focus {
	box-shadow: 0 0 0 3px rgba(139, 92, 246, .25);
}
.section-header .btn-danger {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	margin-right: 0px;
	height: 46px !important;
	line-height: 46px !important;
	padding: 0 16px !important;
}
.btn-sm {
	display: inline-block;
	vertical-align: middle;
	width: 42px;
	height: 28px;
	padding: 0;
	line-height: 28px;
	font-size: 12px;
	text-align: center;
	gap: 0;
}
.header {
	background-color: #ffffff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	position: sticky;
	top: 0;
	z-index: 1000;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.header-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	max-width: 1400px;
	margin: 0 auto;
	height: 76px;
}
.logo {
	font-size: 24px;
	font-weight: 700;
	color: var(--primary-color);
	text-decoration: none;
}
.main-nav-area {
	display: flex;
	align-items: center;
	gap: 20px;
}
.main-nav-area .nav {
	margin-left: -30px;
}
.nav {
	display: flex;
	gap: 0px;
}
.nav a {
	color: #64748b;
	text-decoration: none;
	font-size: 16px;
	font-weight: 500;
	transition: all 0.3s ease;
	margin-right: 0px;
	padding: 8px 12px;
	border-radius: 0px;
	position: relative;
}
.nav a:hover {
	color: var(--primary-color)
}
.nav a.active {
	color: var(--primary-color);
	background-color: rgba(124, 58, 237, 0.15);
	box-shadow: inset 0 2px 0 var(--primary-color);
}
.common-tools-dropdown {
	position: relative;
	display: inline-flex;
	align-items: center;
}
.common-tools-menu {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	min-width: 220px;
	max-width: 360px;
	max-height: 420px;
	overflow: auto;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	display: none;
	z-index: 2100;
	padding: 6px;
}
.common-tools-dropdown.show .common-tools-menu {
	display: block;
}
.common-tools-item {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	padding: 9px 10px;
	border-radius: 8px;
	color: #334155;
	cursor: pointer;
	white-space: nowrap;
	font-size: 13px;
}
.common-tools-item:hover {
	background: rgba(124, 58, 237, 0.12);
	color: var(--primary-color);
}
.common-tools-item .common-tools-item-type {
	font-size: 12px;
	color: #94a3b8;
	flex: 0 0 auto;
}
.common-tools-empty {
	padding: 12px 10px;
	color: #64748b;
	font-size: 13px;
}
#commonToolModal .modal-body {
	padding: 15px;
	box-sizing: border-box;
}
#commonToolModal .modal-content {
	max-width: calc(100% - 60px);
	max-height: calc(100% - 60px);
	overflow: hidden !important;
	transition: none !important;
	transform: none !important;
}
#commonToolModal.modal-visible .modal-content {
	padding-bottom: 0 !important;
	transition: none !important;
	transform: none !important;
}
#commonToolModal {
	transition: none !important;
}
#commonToolModal .modal-backdrop {
	transition: none !important;
}
#commonToolModal .modal-body iframe {
	width: 100%;
	height: 100%;
	display: block;
	border: none;
}
.main {
	margin: 0 auto 0 200px;
	padding-bottom: 0px;
	width: calc(100% - 200px);
	min-height: calc(100vh - 80px);
	overflow-y: auto;
	position: relative;
	background-color: #f8fafc;
	padding-bottom: 0px;
	margin-bottom: -10px;
}
.admin-container {
	min-height: calc(100vh - 180px);
}
.admin-sidebar {
	width: 200px;
	min-width: 200px;
	max-width: 200px;
	background-color: #23262e;
	border-radius: 0;
	box-shadow: none;
	padding: 0 0 60px 0;
	position: fixed;
	top: 50px;
	left: 0;
	bottom: 0;
	height: calc(100vh - 50px);
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
	-webkit-overflow-scrolling: touch;
	z-index: 1001;
	margin: 0;
	border: none;
}
.admin-sidebar h3 {
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
	border-bottom: none;
	display: none;
}
.admin-sidebar a.active {
	background-color: var(--primary-color);
	color: white;
}
.admin-content h2 {
	margin-top: 0;
	margin-bottom: 0px;
	color: var(--text-color);
	font-size: 18px;
	border-left: 5px solid var(--primary-color);
	border-radius: 8px 0px 0px 8px;
	padding-left: 15px;
}
.admin-table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	margin-bottom: 24px;
	border: none;
	font-family: 'Microsoft YaHei', 'SimSun', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
}
.admin-table th, .admin-table td {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 75px !important;
	box-sizing: border-box !important;
}
.table-container {
	overflow-x: auto;
	width: 100%;
	margin: 0 -5px;
	padding: 0 5px;
}
.admin-table thead, .admin-table.section-manage thead, .admin-table.category-manage thead, .admin-table.comment-manage thead {
	display: table-header-group;
	position: sticky;
	top: 0;
	z-index: 10;
	background-color: #f8fafc;
	height: 75px !important;
	box-sizing: border-box !important;
	box-shadow: none;
}
.admin-table th, .admin-table td, .admin-table.section-manage th, .admin-table.section-manage td, .admin-table.category-manage th, .admin-table.category-manage td, .admin-table.comment-manage th, .admin-table.comment-manage td, .post-table th, .post-table td, .user-table th, .user-table td, .comment-table th, .comment-table td {
	border-left: none !important;
	border-right: none !important;
}
.admin-table, .post-table, .user-table, .comment-table {
	border-spacing: 0 !important;
}
.admin-table th, .admin-table td, .post-table th, .post-table td, .user-table th, .user-table td, .comment-table th, .comment-table td {
	border: none !important;
	border-bottom: 1px solid #e5e7eb !important;
}
.admin-table th, .admin-table td {
	padding: 0 20px !important;
	text-align: left;
	border: none !important;
	border-bottom: 1px solid #e5e7eb !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: middle !important;
	height: 75px !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	outline: none !important;
}
.admin-table th:last-child, .admin-table td:last-child {
	text-align: right !important;
}
.admin-table td {
	color: #334155;
}
.admin-table td, .post-table td, .user-table td, .comment-table td {
	font-size: 14px !important;
}
.admin-table tbody tr {
	transition: background-color 0.2s ease;
}
.admin-table tbody tr {
	background-color: #fff;
}
.admin-table th, .post-table th, .user-table th, .comment-table th {
	background-color: #f8fafc;
	font-weight: 600;
	color: #64748b;
	position: sticky;
	top: 0;
	z-index: 10;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 0.5px;
	border-bottom: 1px solid #e5e7eb !important;
}
.admin-table.section-manage, .admin-table.category-manage, .admin-table.comment-manage {
	table-layout: fixed !important;
	width: 100% !important;
}
.admin-table th.col-right, .admin-table td.col-right, .admin-table th:last-child, .admin-table td:last-child {
	text-align: right !important;
}
.admin-content {
	display: block;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	padding: 20px;
	box-sizing: border-box;
	padding-bottom: 0px;
	padding-top: 17px;
}
.table-container {
	overflow-x: auto;
	width: 100%;
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	border: 1px solid transparent;
	background-color: white;
}
.admin-card {
	transition: all 0.2s ease;
	background-color: white;
	border-radius: 12px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	padding: 34px;
	border: 1px solid #f0f0f0;
	margin-bottom: 20px;
	position: relative;
}
.admin-container {
	display: flex;
	gap: 10px;
}
.admin-sidebar {
	width: 200px;
	position: fixed;
	top: 78px;
	left: 0;
	bottom: 0;
	height: calc(100vh - 50px);
	margin: 0;
	border: none;
	padding-top: 25px;
}
.admin-content {
	flex: 1;
	width: calc(100% - 200px);
}
.admin-table.category-manage {
	table-layout: fixed !important;
	width: 100% !important;
	border-collapse: collapse !important;
	position: relative;
	border-spacing: 0 !important;
}
.admin-table.category-manage tr {
	height: 76px !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	padding: 0 !important;
}
.admin-table.category-manage th, .admin-table.category-manage td {
	width: 90px !important;
	height: 75px !important;
	line-height: 75px !important;
	padding: 0 20px !important;
	box-sizing: border-box !important;
	vertical-align: middle !important;
	margin: 0 !important;
	border: none !important;
	border-bottom: 1px solid #e5e7eb !important;
	outline: none !important;
}
.admin-table-wrapper {
	position: relative;
	overflow-x: auto;
	margin-bottom: 0px;
}
.admin-table-scroll {
	overflow-x: auto;
	position: relative;
	min-width: 100%;
}
.admin-table.category-manage thead {
	height: 75px !important;
	box-sizing: border-box !important;
}
.admin-table.category-manage thead tr {
	height: 75px !important;
	line-height: 75px !important;
	box-sizing: border-box !important;
	display: table-row !important;
}
.admin-table.category-manage th {
	font-size: 15px !important;
	font-weight: 600 !important;
	height: 75px !important;
	line-height: 75px !important;
	box-sizing: border-box !important;
}
 .admin-table.category-manage td:nth-child(2) img {
 vertical-align: middle !important;
 max-height: 50px !important;
 display: inline-block !important;
 margin: 0 !important;
 padding: 0 !important;
}
.admin-table.category-manage td input[type="checkbox"], .admin-table.category-manage td .switch {
	vertical-align: middle !important;
	margin: 0 !important;
	padding: 0 !important;
	display: inline-block !important;
}
 .admin-table.category-manage td:nth-child(6) {
 text-align: left !important;
 position: relative !important;
 vertical-align: middle !important;
 line-height: 76px !important;
}
 .admin-table.category-manage td:nth-child(6) form {
 display: inline-block;
 margin: 0;
 padding: 0;
 vertical-align: middle;
}
 .admin-table.category-manage td:nth-child(6) .switch, .admin-table.category-manage td:nth-child(6) .theme-switch {
 margin: 0 !important;
 display: inline-block !important;
 vertical-align: middle !important;
 position: relative !important;
 top: -1px !important;
 transform: translateY(0) !important;
}
 .admin-table.category-manage td:nth-child(4) select {
 vertical-align: middle !important;
 margin: 0 !important;
 display: inline-block !important;
}
.admin-table.category-manage th:first-child, .admin-table.category-manage td:first-child {
	width: 70px !important;
}
 .admin-table.category-manage th:nth-child(2), .admin-table.category-manage td:nth-child(2) {
 width: 90px !important;
 text-align: left !important;
}
 .admin-table.category-manage th:nth-child(3), .admin-table.category-manage td:nth-child(3) {
 width: 130px !important;
 min-width: 130px !important;
 max-width: 130px !important;
}
 .admin-table.category-manage th:nth-child(4), .admin-table.category-manage td:nth-child(4) {
 width: 180px !important;
 text-align: left !important;
}
 .admin-table.category-manage th:nth-child(5), .admin-table.category-manage td:nth-child(5) {
 width: 160px !important;
 text-align: left !important;
}
 .admin-table.category-manage td:nth-child(5) .theme-switch, .admin-table.comment-manage td .theme-switch {
 vertical-align: middle !important;
 display: inline-block !important;
 margin: 0 !important;
 position: relative !important;
 top: 1px !important;
 margin-right: 10px !important;
}
.admin-table.category-manage th:last-child, .admin-table.category-manage td:last-child {
	width: 180px !important;
	text-align: right !important;
}
.admin-table input[type="checkbox"] {
	width: 18px;
	height: 18px;
	cursor: pointer;
	accent-color: var(--primary-color);
	vertical-align: middle !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: normal !important;
}
.admin-table #select-all-comments {
	accent-color: var(--primary-color);
}
.admin-table .action-buttons-right .btn-sm, .admin-table .action-column .btn-sm, .admin-table .action-cell .btn-sm, .admin-table .fixed-action-column .btn-sm, .admin-table td:last-child .btn-sm {
	margin-left: 0px !important;
}
.admin-table .action-buttons-right .btn-sm:first-child, .admin-table .action-column .btn-sm:first-child, .admin-table .action-cell .btn-sm:first-child, .admin-table .fixed-action-column .btn-sm:first-child, .admin-table td:last-child .btn-sm:first-child {
	margin-left: 0 !important;
}
.admin-table.comment-manage .comment-content {
}
.admin-table tr {
	transition: none;
}
.admin-table tr:hover {
	background-color: #f9fafb !important;
	transform: translateY(0px);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
.form-group {
	margin-bottom: 15px;
}
.form-row {
	display: flex;
	gap: 20px;
	margin-bottom: 15px;
}
.form-row .form-group {
	margin-bottom: 0;
	flex: 1;
}
.form-group label {
	display: block;
	margin-bottom: 5px;
	font-weight: 500;
	color: #2d3748;
	font-size: 14px;
}
.form-group {
	margin-bottom: 15px;
}
.form-control {
	width: 100%;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--text-color);
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid var(--border-color);
	border-radius: 6px;
	transition: border-color 0.2s ease;
	box-sizing: border-box;
}
.form-control:focus {
	outline: none !important;
	border-color: var(--primary-color);
	box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.15);
}
textarea.form-control {
	resize: vertical;
	min-height: 80px;
	font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
	background-clip: padding-box;
	border: 1px solid var(--border-color);
	border-radius: 6px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	box-sizing: border-box;
}
select, select.status-select, select.form-control {
	appearance: none !important;
	-moz-appearance: none !important;
	-webkit-appearance: none !important;
	-ms-appearance: none !important;
	-o-appearance: none !important;
	background: transparent !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 5px center !important;
	background-size: 18px !important;
	padding: 8px 12px !important;
	padding-right: 25px !important;
	margin: 0 !important;
	height: auto !important;
	min-height: auto !important;
	max-height: auto !important;
	width: 100% !important;
	min-width: 100% !important;
	border: 1px solid #ddd !important;
	border-radius: 6px !important;
	cursor: pointer !important;
	font-size: 14px !important;
	font-family: inherit !important;
	color: #333 !important;
	line-height: 1.5 !important;
	box-sizing: border-box !important;
	transition: border-color 0.2s ease !important;
}
.admin-table select, .admin-table select.status-select, .admin-table select.form-control {
	height: 34px !important;
	min-height: 34px !important;
	line-height: 34px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	border-radius: 4px !important;
}
select:hover, select.status-select:hover, select.form-control:hover {
	border-color: #c0c0c0 !important;
	background-color: transparent !important;
	box-shadow: none !important;
}
select:focus, select.status-select:focus, select.form-control:focus {
	outline: none !important;
	border-color: var(--primary-color) !important;
	background-color: transparent !important;
	box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.15) !important;
}
.inline-form {
	margin: 0;
	padding: 0;
}
.pagination-container {
	margin-top: 0px;
	padding-top: 20px;
	margin-bottom: 10px;
}
.pagination-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}
.pagination-buttons {
	display: flex;
	gap: 5px;
	align-items: center;
}
.pagination-btn {
	display: inline-flex;
	padding: 0 12px;
	border: 1px solid #ddd;
	background-color: #fff;
	color: #333;
	text-decoration: none;
	border-radius: 4px;
	transition: all 0.3s ease;
	cursor: pointer;
	height: 36px;
	line-height: 36px;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	box-sizing: border-box;
}
.pagination-btn.page-number {
	width: 36px;
	min-width: 36px;
	max-width: 36px;
	padding: 0;
}
 .pagination-btn:hover:not(.disabled):not(.active) {
 background-color: #f5f5f5;
 border-color: #ccc;
}
.pagination-btn.active {
	background-color: var(--primary-color);
	color: white;
	border-color: var(--primary-color);
}
.pagination-btn.disabled {
	opacity: 0.5;
	cursor: not-allowed;
	background-color: #f5f5f5;
}
.pagination-settings {
	display: flex;
	align-items: center;
	gap: 10px;
}
.pagination-settings span {
	font-size: 14px;
}
.pagination-select, .posts-per-page-select {
	width: 85px !important;
	min-width: 85px !important;
	max-width: 85px !important;
	height: 36px !important;
	font-size: 14px !important;
	padding: 4px 10px !important;
	border: 1px solid #ddd !important;
	border-radius: 4px !important;
	margin: 0 5px !important;
}
.badge-admin {
	background-color: var(--danger-color);
	color: white;
}
.badge-user {
	background-color: var(--primary-color);
	color: white;
}
.message {
	padding: 12px 16px;
	margin-bottom: 20px;
	border-radius: 6px;
	font-weight: 500;
}
.message-success {
	background-color: #dcfce7;
	color: #166534;
	border: 1px solid #bbf7d0;
}
.message-error {
	background-color: #fee2e2;
	color: #991b1b;
	border: 1px solid #fecaca;
}
#toast-container {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 10001;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: center;
}
.toast {
	background-color: rgba(0, 0, 0, 0.85);
	color: white;
	padding: 15px 28px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 500;
	max-width: 400px;
	white-space: normal;
	text-align: center;
	line-height: 1.5;
	opacity: 0;
	transform: translateX(100%);
	transition: opacity 0.3s ease, transform 0.3s ease;
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
}
.toast.toast-visible {
	opacity: 1;
	transform: translateX(0);
}
.toast.toast-success, .toast.toast-warning, .toast.toast-info {
}
.toast.toast-error {
	background-color: rgba(255, 69, 0, 0.85);
}
.toast.toast-info {
	background-color: var(--toast-bg);
}
#confirm-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10000;
	backdrop-filter: blur(2px);
}
.confirm-dialog {
	background: white;
	border-radius: 12px;
	padding: 32px 32px 24px 32px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
	opacity: 0;
	transform: scale(0.95) translateY(20px);
	transition: all 0.25s ease;
	min-width: 340px;
	max-width: 400px;
	overflow: hidden;
	border: none;
}
.confirm-dialog.confirm-visible {
	opacity: 1;
	transform: scale(1) translateY(0);
}
.confirm-header {
	text-align: center;
	background: #ffffff;
	border-bottom: none;
	padding: 0 0 0px 0;
}
.confirm-icon {
	width: 48px;
	height: 48px;
	margin: 0 auto 16px auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(251, 191, 36, 0.1);
	border-radius: 50%;
	animation: pulse 2s infinite;
}
 @keyframes pulse {
 0% {
 transform: scale(1);
 box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.4);
}
 70% {
 transform: scale(1.05);
 box-shadow: 0 0 0 10px rgba(251, 191, 36, 0);
}
 100% {
 transform: scale(1);
 box-shadow: 0 0 0 0 rgba(251, 191, 36, 0);
}
}
.confirm-icon svg {
	width: 24px;
	height: 24px;
	color: #f59e0b;
	animation: bounce 2s infinite;
}
 @keyframes bounce {
 0%,  20%,  50%,  80%,  100% {
 transform: translateY(0);
}
 40% {
 transform: translateY(-5px);
}
 60% {
 transform: translateY(-3px);
}
}
.confirm-message {
	color: #4b5563;
	font-weight: 500;
	line-height: 30px;
	font-size: 16px;
	margin: 0;
	text-align: center;
}
.confirm-body {
	background: white;
	padding: 0;
}
.confirm-buttons {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-top: 25px;
	padding-bottom: 10px;
}
.confirm-btn {
	padding: 10px 28px;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
	min-width: 90px;
}
.cancel-btn {
	background: #f9fafb;
	color: #6b7280;
	border: 1px solid #e5e7eb;
}
.cancel-btn:hover {
	background: #f3f4f6;
	transform: translateY(-1px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.cancel-btn:active {
	transform: translateY(0);
}
.confirm-btn.confirm-btn {
	background: var(--primary-color);
	color: white;
	box-shadow: 0 2px 8px rgba(124, 58, 237, 0.2);
}
.confirm-btn.confirm-btn:hover {
	background: var(--primary-dark);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(236, 72, 153, 0.25);
}
.confirm-btn.confirm-btn:active {
	transform: translateY(0);
	box-shadow: 0 2px 8px rgba(236, 72, 153, 0.2);
}
.confirm-buttons .confirm-btn {
	background: var(--primary-color);
	color: white;
	border-radius: 50px;
	box-shadow: 0 2px 8px rgba(236, 72, 153, 0.2);
	width: 100px;
	height: 40px;
	min-width: 100px;
}
.confirm-buttons .confirm-btn:hover {
	background: var(--primary-color);
 filter: alpha(opacity:90);
	opacity: 0.9;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(236, 72, 153, 0.25);
}
.confirm-buttons .confirm-btn:active {
	transform: translateY(0);
	box-shadow: 0 2px 8px rgba(236, 72, 153, 0.2);
}
.editor-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 12px;
	background-color: #f9fafb;
	border: 1px solid var(--border-color);
	border-bottom: none;
	border-radius: 6px 6px 0 0;
}
.editor-btn {
	background: none;
	border: 1px solid var(--border-color);
	border-radius: 4px;
	padding: 6px 8px;
	cursor: pointer;
	transition: all 0.2s ease;
}
.editor-btn:hover {
	background-color: #e5e7eb;
}
.editor-content {
	width: 100%;
	max-width: 100%;
	min-height: 300px;
	padding: 12px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--text-color);
	background-color: #fff;
	border: 1px solid var(--border-color);
	border-radius: 0 0 6px 6px;
	resize: vertical;
	box-sizing: border-box;
}
.editor-content:focus {
	outline: none;
	border-color: var(--primary-color);
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1);
}
.sidebar-toggle {
	display: none;
	position: fixed;
	top: 15px;
	left: 15px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: var(--primary-color);
	color: white;
	border: none;
	cursor: pointer;
	z-index: 999;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
}
.sidebar-toggle:hover {
	background-color: var(--primary-hover);
	transform: scale(1.05);
}
.sidebar-toggle svg {
	width: 20px;
	height: 20px;
}
.sidebar-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 998;
	transition: opacity 0.3s ease;
	opacity: 0;
}
.sidebar-overlay.active {
	opacity: 1;
}
.section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}
.action-buttons {
	display: flex;
	gap: 20px;
}
.inline-form {
	display: inline-block;
}
.status-select {
	min-width: 30px;
	padding: 3px 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	background-color: #fff;
	cursor: pointer;
}
.comment-content {
	max-width: 200px;
	word-break: break-word;
}
.alert {
	padding: 12px 20px;
	border-radius: 4px;
	margin-bottom: 20px;
	font-size: 14px;
}
.alert-success {
	background-color: #d1fae5;
	color: #065f46;
	border-left: 4px solid #10b981;
}
.mb-4 {
	margin-bottom: 16px;
}
.badge-active {
	background-color: var(--primary-light);
	color: #fff;
 filter: alpha(opacity:70);
	opacity: 0.7;
}
.form-row {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 15px;
}
.form-col {
	flex: 1;
	margin-right: 15px;
	min-width: 250px;
}
.form-col:last-child {
	margin-right: 0;
}
.thumbnail-upload-container {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
#thumbnail {
	display: none;
}
.thumbnail-preview {
	min-height: 80px;
	border: 2px dashed #d1d5db;
	padding: 10px 15px;
	border-radius: 8px;
	background-color: #f9fafb;
	display: flex;
	align-items: center;
	font-size: 14px;
	line-height: 1.5;
	transition: all 0.3s ease;
	position: relative;
	gap: 10px;
	justify-content: center;
}
.thumbnail-preview:hover {
	border-color: var(--primary-color);
	background-color: #f5f3ff;
}
.thumbnail-upload-btn {
	padding: 6px 12px;
	background-color: var(--primary-color);
	color: white;
	border-radius:2px;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	transition: all 0.2s ease;
	border: none;
	outline: none;
	white-space: nowrap;
}
.thumbnail-upload-btn:hover {
	background-color: var(--primary-dark);
	transform: translateY(-1px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.thumbnail-upload-btn:active {
	transform: translateY(0);
}
.thumbnail-path {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
}
.thumbnail-path span {
	color: #6b7280;
}
.thumbnail-path code {
	background-color: #e5e7eb;
	padding: 2px 6px;
	border-radius: 4px;
	color: #374151;
	font-family: 'Courier New', monospace;
	font-size: 13px;
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.thumbnail-placeholder {
	color: #9ca3af;
	text-align: center;
	width: 100%;
}
.theme-switch {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 26px;
	margin: 0;
}
.theme-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.theme-switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #e0e0e0;
 transition: .3s ease;
	border-radius: 26px;
	border: 1px solid #ccc;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}
.theme-switch .slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 2px;
	bottom: 2px;
	background-color: white;
 transition: .3s ease;
	border-radius: 50%;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
.theme-switch input:checked+.slider {
	background-color: #007bff;
	border-color: #007bff;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}
.theme-switch input:checked+.slider:before {
	transform: translateX(24px);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
.theme-switch input:focus+.slider {
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 0 2px rgba(0, 123, 255, 0.25);
}
 .theme-switch:hover input:not(:disabled)+.slider {
 background-color: #d0d0d0;
}
 .theme-switch:hover input:not(:disabled):checked+.slider {
 background-color: #0056b3;
}
.theme-switch input:disabled+.slider {
	opacity: 0.6;
	cursor: not-allowed;
}
.theme-switch input:disabled+.slider:before {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
 @keyframes switchOn {
 from {
 transform: scale(1);
}
to {
	transform: scale(1.05);
}
}
.theme-switch input:checked+.slider {
	animation: switchOn 0.2s ease;
}
.switch-label {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	user-select: none;
}
.switch-label .switch-text {
	margin-left: 8px;
	font-size: 14px;
	color: #666;
}
.switch-label .switch-text.active {
	color: #007bff;
	font-weight: 500;
}
.thumbnail-upload-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 200px;
}
.thumbnail-placeholder {
	color: #6b7280;
	font-size: 14px;
}
.thumbnail-image {
	max-width: 100%;
	max-height: 200px;
}
.thumbnail-image img {
	border-radius: 6px;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease;
}
.thumbnail-image img:hover {
	transform: scale(1.02);
}
.thumbnail-path {
	font-family: monospace;
	color: #374151;
	padding: 5px 10px;
	border-radius: 4px;
	word-break: break-all;
	text-align: left;
}
.thumbnail-path code {
	color: #1e40af;
	font-weight: 500;
}
.admin-table td img {
	transition: transform 0.2s ease;
}
.admin-table td img:hover {
	transform: scale(2);
	z-index: 10;
	position: relative;
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}
.category-name-link {
	color: #334155;
	text-decoration: none;
	vertical-align: middle;
	display: inline-block;
	line-height: 75px;
}
.category-name-link:hover {
	color: var(--primary-color);
	text-decoration: underline;
}
.modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2000;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}
.modal.modal-visible {
	opacity: 1;
	visibility: visible;
}
.modal-backdrop {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5) !important;
	backdrop-filter: blur(2px) !important;
	-webkit-backdrop-filter: blur(2px) !important;
	transition: opacity 0.3s ease;
}
.modal-content {
	position: relative;
	background-color: white;
	border-radius: 8px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
	width: 100%;
	max-width: 550px;
	max-height: 650px;
	overflow-y: auto;
	transform: scale(0.95);
	opacity: 0;
	transition: transform 0.3s ease, opacity 0.3s ease;
}
.modal.modal-visible .modal-content {
	transform: scale(1);
	opacity: 1;
	padding-bottom: 10px;
}
.modal-header {
	padding: 20px;
	border-bottom: 1px solid var(--border-color);
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.modal-title {
	font-size: 18px;
	font-weight: 600;
	color: var(--text-primary);
	margin: 0;
}
.modal-close {
	width: 28px;
	height: 28px;
	border: none;
	background: #dbdbdb;
	border-radius: 50%;
	cursor: pointer;
	position: relative;
	transition: all 0.3s ease;
	color: transparent;
	font-size: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
 .modal-close::before, .modal-close::after {
 content: '';
 position: absolute;
 top: 50%;
 left: 50%;
 width: 12px;
 height: 2px;
 background: #fff;
 transform: translate(-50%, -50%) rotate(45deg);
 transition: all 0.3s ease;
}
 .modal-close::after {
 transform: translate(-50%, -50%) rotate(-45deg);
}
.modal-close:hover {
	background: #ff5252;
	transform: rotate(90deg);
}
 .modal-close:hover::before, .modal-close:hover::after {
 width: 14px;
}
.modal-body {
	padding: 30px;
}
.modal-footer {
	padding: 20px;
	border-top: 0px solid var(--border-color);
	display: flex;
	justify-content: flex-end;
	gap: 12px;
}
.form-group {
	margin-bottom: 15px;
}
.form-control {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #d1d5db;
	border-radius: 4px;
	font-size: 14px;
	transition: border-color 0.2s ease;
	box-sizing: border-box;
	margin-bottom: 0px;
}
textarea.form-control {
	resize: vertical;
	min-height: 80px;
}
.form-control:focus {
	outline: none;
	border-color: var(--primary);
}
#commentEditModal textarea {
	min-height: 120px;
}
.progress-container {
	text-align: center;
	padding: 0px 12px 0px 12px;
	background-color: white;
	border-radius: 16px;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	transition: all 0.3s ease;
	border: 1px solid rgba(0, 0, 0, 0.05);
	position: relative;
	overflow: hidden;
	width: 220px;
}
.progress-container:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.rectangular-progress {
	position: relative;
	width: 200px;
	height: 100px;
	margin: 0 auto 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.progress-content {
	position: absolute;
	text-align: center;
}
.progress-number {
	font-size: 38px;
	font-weight: 700;
	margin-bottom: 8px;
	letter-spacing: -0.5px;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	color: var(--text-primary);
}
.progress-label {
	font-size: 16px;
	color: var(--text-secondary);
	font-weight: 500;
}
.switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 20px;
}
.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
 transition: .4s;
	border-radius: 20px;
}
.theme-switch {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 24px;
}
.theme-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.theme-switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #e0e0e0;
 transition: .3s ease;
	border-radius: 24px;
	border: 1px solid #ccc;
}
.theme-switch .slider:before {
	position: absolute;
	content: "";
	height: 18px;
	width: 18px;
	left: 2px;
	bottom: 2px;
	background-color: white;
 transition: .3s ease;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.theme-switch input:checked+.slider {
	background-color: #007bff;
	border-color: #007bff;
}
.theme-switch input:focus+.slider {
	box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}
.theme-switch input:checked+.slider:before {
	transform: translateX(22px);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.theme-switch:hover .slider {
	background-color: #d0d0d0;
}
.theme-switch:hover input:checked+.slider {
	background-color: #0056b3;
}
.theme-switch input:disabled+.slider {
	opacity: 0.6;
	cursor: not-allowed;
}
.empty-message, .loading, .error-message {
	text-align: center;
	padding: 30px;
	color: var(--text-secondary);
}
.error-message {
	color: var(--error-color);
}
 #navigationEditModal label, #imagePropertiesModal label:not(.modal-footer label) {
 display: block;
 margin-bottom: 5px;
 font-weight: 500;
}
#navigationEditModal input[type="text"], #navigationEditModal input[type="number"], #navigationEditModal select, #imagePropertiesModal input[type="text"], #imagePropertiesModal input[type="number"], #imagePropertiesModal select {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid var(--border-color);
	border-radius: 4px;
	font-size: 14px;
}
#navigationEditModal input[type="text"]:focus, #navigationEditModal input[type="number"]:focus, #navigationEditModal select:focus, #imagePropertiesModal input[type="text"]:focus, #imagePropertiesModal input[type="number"]:focus, #imagePropertiesModal select:focus {
	outline: none;
	border-color: var(--primary-color);
	box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.2);
}
#navigationEditModal .modal-actions, #imagePropertiesModal .modal-actions {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}
input[type="checkbox"].form-checkbox {
	margin-right: 8px;
	margin-left: 0;
	cursor: pointer;
	width: 16px;
	height: 16px;
	vertical-align: middle;
}
#imagePropertiesModal .modal-footer label {
	margin-left: 0;
}
#imagePropertiesModal .modal-footer .modal-actions {
	margin-right: 0;
}

::-webkit-scrollbar {
 width: 10px;
 height: 10px;
 background-color: #eee;
}

::-webkit-scrollbar-thumb:hover {
 background: var(--primary-color);
}


::-webkit-scrollbar-track {
 border-radius: 11px;
 background-color: #eee;
}


::-webkit-scrollbar-thumb {
 border-radius: 11px;
 -webkit-box-shadow: inset 0 0 4px rgba(15, 23, 42, .14);
 background-color: #e4e8ed;
}

::-webkit-scrollbar-thumb:active {
 background: var(--primary-color);
}
 @media (max-width: 1089px) {
 .search-bar {
 display: none !important;
}
}
.admin-sidebar a {
	display: flex;
	align-items: center;
	text-decoration: none;
	padding: 10px 15px;
	color: #b5c0cf;
	width: 100%;
	box-sizing: border-box;
	font-size: 14px;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-family: 'Microsoft YaHei', 'SimSun', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	letter-spacing: 0.01em;
}
.admin-sidebar a svg {
	margin-right: 8px;
	width: 16px;
	height: 16px;
	margin-left: 25px;
}
.admin-sidebar>a:hover, .admin-sidebar .menu-dropdown>a:hover {
	color: #e5e7eb;
	transition: all 0.2s ease;
}
.admin-sidebar>a:hover svg, .admin-sidebar .menu-dropdown>a:hover svg {
	stroke: #e5e7eb;
}
.admin-sidebar>a.active, .admin-sidebar .menu-dropdown>a.active {
	background: var(--primary-color, #1890ff);
	color: #ffffff;
}
.admin-sidebar>a.active svg, .admin-sidebar .menu-dropdown>a.active svg {
	stroke: #ffffff;
}
.menu-dropdown {
	position: relative;
	width: 100%;
}
.dropdown-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px 15px;
	color: #333;
	text-decoration: none;
	border: none;
	background: none;
	cursor: pointer;
	transition: background-color 0.3s;
	box-sizing: border-box;
}
.dropdown-toggle:hover {
	background-color: rgba(0, 0, 0, 0.05);
}
.dropdown-toggle.active {
	background-color: rgba(0, 0, 0, 0.1);
}
.dropdown-arrow {
	font-size: 12px;
	transition: transform 0.3s;
	margin-left: auto;
}
.dropdown-content {
	position: static;
	background: transparent;
	border: none;
	overflow: visible;
	width: 100%;
	display: none;
}
.dropdown-content a {
	display: flex;
	align-items: center;
	padding: 7px 20px 7px 41px;
	font-size: 13px;
	font-weight: 400;
	color: #9ca3af;
	margin-bottom: 0;
	letter-spacing: 0.2px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-family: 'Microsoft YaHei', 'SimSun', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	transition: all 0.2s ease;
}
.dropdown-content a:hover {
	color: #fff;
}
.dropdown-content a svg {
	margin-right: 8px;
	opacity: 0.8;
}
.nav .sidebar-toggle-btn {
	background: transparent;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.2s ease;
	color: #9ca3af;
	border: none;
	margin-right: 10px;
	padding: 8px;
}
.sidebar-toggle-btn:hover svg {
	stroke: var(--primary-color);
}
.sidebar-toggle-btn svg {
	width: 20px;
	height: 20px;
}
.admin-sidebar .sidebar-toggle-btn {
	position: absolute;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	width: 18px;
	height: 18px;
	background: transparent;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.2s ease;
	color: #9ca3af;
	z-index: 10;
	border: none;
	margin-left: 0;
}
 @media (min-width: 1090px) {
 .admin-sidebar {
 top: 76px;
 height: calc(100vh - 76px);
 padding: 8px 0 16px 0;
 scrollbar-width: thin;
 -ms-overflow-style: auto !important;
}
 .admin-sidebar::-webkit-scrollbar {
 width: 6px;
}
 .admin-sidebar::-webkit-scrollbar-thumb {
 background: #4b5563;
 border-radius: 999px;
}
}
.sidebar-toggle-btn:hover svg {
	stroke: var(--primary-color);
}
body.sidebar-collapsed .admin-sidebar {
	width: 55px;
	min-width: 55px;
	max-width: 55px;
}
body.sidebar-collapsed .admin-sidebar a {
	padding: 10px 15px;
	justify-content: center;
}
body.sidebar-collapsed .admin-sidebar a svg {
	margin: 0;
}
body.sidebar-collapsed .admin-sidebar>a:hover, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a:hover {
	background: #374151;
	color: #ffffff;
}
body.sidebar-collapsed .admin-sidebar>a.active, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a.active {
	background: #ec4899;
	color: #ffffff;
}
body.sidebar-collapsed .admin-sidebar a span, body.sidebar-collapsed .admin-sidebar a .dropdown-arrow {
	display: none;
}
body.sidebar-collapsed .dropdown-content.popup-menu a span {
	display: inline !important;
}
body.sidebar-collapsed .dropdown-content {
	display: none !important;
}
body.sidebar-collapsed .dropdown-content.popup-menu {
	display: block !important;
	position: fixed;
	background: #ffffff;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	min-width: auto;
	width: auto;
	z-index: 10000;
	padding: 4px 15px;
	border: 1px solid #e5e7eb;
}
body.sidebar-collapsed .dropdown-content.popup-menu a {
	padding: 8px 12px;
	color: #374151;
	font-size: 12px;
	white-space: nowrap;
	background: transparent;
	display: flex;
	align-items: center;
}
body.sidebar-collapsed .dropdown-content.popup-menu a:hover {
	background: color-mix(in srgb, var(--primary-color), transparent 90%);
	color: #111827;
}
body.sidebar-collapsed .dropdown-content.popup-menu a svg {
	width: 14px;
	height: 14px;
	margin-right: 6px;
	margin-left: 0;
	flex-shrink: 0;
}
body.sidebar-collapsed .admin-sidebar>a, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a {
	position: relative;
}
 body.sidebar-collapsed .admin-sidebar>a::before, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a::before {
 content: attr(title);
 position: absolute;
 left: 60px;
 top: 50%;
 transform: translateY(-50%);
 background: #1f2937;
 color: #ffffff;
 padding: 6px 12px;
 border-radius: 4px;
 font-size: 12px;
 white-space: nowrap;
 opacity: 0;
 visibility: hidden;
 transition: opacity 0.2s ease, visibility 0.2s ease;
 z-index: 10000;
 pointer-events: none;
 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
 body.sidebar-collapsed .admin-sidebar>a:hover::before, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a:hover::before {
 opacity: 1;
 visibility: visible;
}
 body.sidebar-collapsed .admin-sidebar>a::after, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a::after {
 content: '';
 position: absolute;
 left: 55px;
 top: 50%;
 transform: translateY(-50%);
 border: 5px solid transparent;
 border-right-color: #1f2937;
 opacity: 0;
 visibility: hidden;
 transition: opacity 0.2s ease, visibility 0.2s ease;
 z-index: 10000;
 pointer-events: none;
}
 body.sidebar-collapsed .admin-sidebar>a:hover::after, body.sidebar-collapsed .admin-sidebar .menu-dropdown>a:hover::after {
 opacity: 1;
 visibility: visible;
}
body.sidebar-collapsed .main {
	margin-left: 55px;
	width: calc(100% - 55px);
}
body.sidebar-collapsed .footer {
	width: calc(100% - 55px);
	margin-left: 55px;
}

.admin-sidebar.qk-sidebar-v2 {
	background: linear-gradient(180deg, #0b1220 0%, #111827 48%, #0f172a 100%);
	padding: 16px 0 78px;
	isolation: isolate;
}

@supports (color: color-mix(in srgb, red, blue)) {
	.admin-sidebar.qk-sidebar-v2::before {
		content: "";
		position: absolute;
		inset: 0;
		background:
			radial-gradient(160px 220px at 18% 0%, color-mix(in srgb, var(--primary-color), transparent 86%) 0%, transparent 72%),
			radial-gradient(180px 240px at 100% 18%, color-mix(in srgb, var(--primary-color), transparent 82%) 0%, transparent 70%);
		pointer-events: none;
		z-index: 0;
	}
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-menu {
	list-style: none;
	margin: 0;
	padding: 0 14px;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-item {
	margin: 2px 0;
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	color: rgba(226, 232, 240, 0.9);
	text-decoration: none;
	border-radius: 14px;
	transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
	font-size: 14px;
	font-weight: 500;
	border: 1px solid transparent;
	position: relative;
	overflow: hidden;
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link.top-level {
	padding: 11px 12px;
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link:hover,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title:hover {
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.06);
	transform: translateY(-1px);
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link.active,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%);
	color: #ffffff;
	font-weight: 600;
	border-color: color-mix(in srgb, var(--primary-color), transparent 60%);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary-color), transparent 50%), 0 4px 16px color-mix(in srgb, var(--primary-color), transparent 82%);
	transform: translateY(-1px);
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link.active::before,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title.active::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 60%;
	background: var(--primary-color);
	border-radius: 0 2px 2px 0;
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link svg,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title svg {
	margin: 0;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	transition: opacity 0.18s ease, color 0.18s ease;
	opacity: 0.92;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link.active svg,
.admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title.active svg {
	opacity: 1;
}

.admin-sidebar.qk-sidebar-v2 .link-text {
	flex: 0 1 auto;
	max-width: 142px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-section {
	margin: 16px 0 14px;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-section-title {
	background: transparent;
	border: 1px solid transparent;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-section-title span {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.9px;
	color: rgba(226, 232, 240, 0.5);
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-section-title:hover span {
	color: rgba(226, 232, 240, 0.58);
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-section-title .dropdown-arrow {
	margin-left: auto;
	width: 12px;
	height: 12px;
	opacity: 0.72;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu {
	padding: 6px 0 0 0;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu a.qk-sidebar-link {
	font-size: 13px;
	font-weight: 400;
	color: rgba(226, 232, 240, 0.82);
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu a.qk-sidebar-link svg {
	opacity: 0.86;
}

.admin-sidebar.qk-sidebar-v2 .qk-sidebar-divider {
	height: 1px;
	margin: 16px 18px 12px;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.14) 50%, rgba(255, 255, 255, 0.04) 100%);
	border-radius: 1px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-divider {
	height: 1px;
	margin: 16px 18px 12px;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.14) 50%, rgba(255, 255, 255, 0.04) 100%);
	border-radius: 1px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

@supports (color: color-mix(in srgb, red, blue)) {
	.admin-sidebar.qk-sidebar-v2 .qk-sidebar-divider::after {
		content: '';
		position: absolute;
		top: 0;
		left: -40%;
		width: 40%;
		height: 100%;
		background: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--primary-color), transparent 15%) 50%, transparent 100%);
		animation: qkSidebarDividerSweep 2.4s ease-in-out infinite;
	}

	.admin-sidebar.qk-sidebar-v2 .sidebar-divider::after {
		content: '';
		position: absolute;
		top: 0;
		left: -40%;
		width: 40%;
		height: 100%;
		background: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--primary-color), transparent 15%) 50%, transparent 100%);
		animation: qkSidebarDividerSweep 2.4s ease-in-out infinite;
	}
}

@keyframes qkSidebarDividerSweep {
	0% { left: -40%; }
	100% { left: 100%; }
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 > .qk-sidebar-menu {
	padding-left: 10px;
	padding-right: 10px;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 a.qk-sidebar-link,
body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .menu-dropdown > a.qk-sidebar-section-title {
	justify-content: center;
	padding: 16px;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .qk-sidebar-divider {
	width: 56px;
	margin: 14px auto;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu {
	list-style: none;
	padding: 0 14px;
	margin: 0;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-item {
	margin: 2px 0;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	color: rgba(226, 232, 240, 0.9);
	text-decoration: none;
	border-radius: 14px;
	transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
	font-size: 14px;
	font-weight: 500;
	justify-content: center;
	min-height: 42px;
	border: 1px solid transparent;
	position: relative;
	overflow: hidden;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link.top-level {
	padding: 11px 12px;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link:hover {
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.06);
	transform: translateY(-1px);
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link:hover svg {
	opacity: 0.96;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%);
	color: #ffffff;
	font-weight: 600;
	border: 1px solid color-mix(in srgb, var(--primary-color), transparent 60%);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary-color), transparent 50%), 0 4px 16px color-mix(in srgb, var(--primary-color), transparent 82%);
	transform: translateY(-1px);
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link.active::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 60%;
	background: var(--primary-color);
	border-radius: 0 2px 2px 0;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	transition: opacity 0.18s ease, color 0.18s ease;
	opacity: 0.92;
	margin: 0;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link.active svg {
	color: #ffffff;
	opacity: 1;
}

.admin-sidebar.qk-sidebar-v2 .link-text {
	flex: 0 1 auto;
	max-width: 142px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link:not(.top-level) {
	font-size: 13px;
	font-weight: 400;
	color: rgba(226, 232, 240, 0.82);
	opacity: 1;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-menu-link:not(.top-level) svg {
	opacity: 0.86;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section {
	margin: 16px 0 14px;
	position: relative;
	z-index: 1;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section:first-child {
	margin-top: 0;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-title {
	padding: 6px 12px 8px;
	font-size: 12px;
	font-weight: 600;
	color: rgba(226, 232, 240, 0.5);
	letter-spacing: 0.9px;
	cursor: pointer;
	user-select: none;
	transition: all 0.2s;
	text-align: left;
	display: flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	justify-content: flex-start;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-line {
	height: 1px;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.02) 0%, rgba(226, 232, 240, 0.14) 50%, rgba(255, 255, 255, 0.02) 100%);
	border-radius: 1px;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-line-left {
	flex: 0 0 10px;
	opacity: 0.5;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-line-right {
	flex: 1 1 auto;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-text {
	flex: 0 0 auto;
	padding: 0 8px 0 0;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-line,
body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-text {
	display: none;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-title {
	justify-content: center;
	padding: 16px;
	min-height: 54px;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-title:hover {
	background: rgba(255, 255, 255, 0.08);
	color: #ffffff;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-title.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%);
	color: #ffffff;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link,
body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.top-level {
	transform: none !important;
	border-color: transparent !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link:hover,
body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.top-level:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #ffffff !important;
	transform: none !important;
	border-color: transparent !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.active,
body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.top-level.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%) !important;
	color: #ffffff !important;
	transform: none !important;
	border-color: transparent !important;
	box-shadow: none !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.active::before,
body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.top-level.active::before {
	display: none !important;
}

.admin-sidebar.qk-sidebar-v2 .sidebar-section-icon {
	display: none;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-section-icon {
	display: block;
	margin: 0;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	opacity: 0.92;
	transition: opacity 0.18s ease, color 0.18s ease;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a {
	color: #1f2937 !important;
	height: 45px !important;
	min-height: 45px !important;
	display: flex !important;
	align-items: center !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a:hover {
	background: color-mix(in srgb, var(--primary-color), transparent 90%) !important;
	color: var(--primary-color) !important;
	font-weight: 500 !important;
	border: 1px solid color-mix(in srgb, var(--primary-color), transparent 75%) !important;
	box-shadow: none !important;
	transform: translateY(-1px) !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a:hover svg {
	color: var(--primary-color) !important;
	stroke: var(--primary-color) !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%) !important;
	color: var(--primary-color) !important;
	font-weight: 600 !important;
	border: 1px solid color-mix(in srgb, var(--primary-color), transparent 60%) !important;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary-color), transparent 50%), 0 4px 16px color-mix(in srgb, var(--primary-color), transparent 82%) !important;
	transform: translateY(-1px) !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a svg {
	stroke: #4b5563 !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .dropdown-content.popup-menu a.active svg {
	color: var(--primary-color) !important;
	stroke: var(--primary-color) !important;
}
.admin-header {
	margin-bottom: 20px;
}
.modal-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.5) !important;
	backdrop-filter: blur(2px) !important;
	-webkit-backdrop-filter: blur(2px) !important;
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 9998;
}
.modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}
.modal-content {
	background-color: white;
	border-radius: 8px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	width: fit-content;
	max-width: 90%;
	min-width: 0;
	max-height: 90vh;
	overflow-y: auto;
	position: relative;
	z-index: 9999;
	transform: scale(0.95);
	transition: transform 0.3s ease;
	margin: 0 auto;
}
.modal-visible {
	display: flex !important;
	opacity: 1;
}
.modal-visible .modal-backdrop {
	opacity: 1;
}
.modal-visible .modal-content {
	transform: scale(1);
}
.modal-header {
	padding: 16px 20px;
	border-bottom: 1px solid #e0e0e0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.modal-header h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	color: #333;
}
.close {
	width: 28px;
	height: 28px;
	border: none;
	background: #dbdbdb;
	border-radius: 50%;
	cursor: pointer;
	position: relative;
	transition: all 0.3s ease;
	color: transparent;
	font-size: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
 .close::before, .close::after {
 content: '';
 position: absolute;
 top: 50%;
 left: 50%;
 width: 12px;
 height: 2px;
 background: #fff;
 transform: translate(-50%, -50%) rotate(45deg);
 transition: all 0.3s ease;
}
 .close::after {
 transform: translate(-50%, -50%) rotate(-45deg);
}
.close:hover {
	background: #ff5252;
	transform: rotate(90deg);
}
 .close:hover::before, .close:hover::after {
 width: 14px;
}
.form-control {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
	transition: border-color 0.2s;
	box-sizing: border-box;
}
.form-control:focus {
	outline: none;
	border-color: #17a2b8;
	box-shadow: 0 0 0 2px rgba(23, 162, 184, 0.2);
}
.modal-body {
	max-height: calc(90vh - 100px);
	overflow-x: hidden;
}
.pagination-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}
 @media (max-width: 768px) {
 header {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 z-index: 9999;
 background-color: #fff;
 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
 height: 70px;
 display: flex;
 align-items: center;
 border-bottom: 1px solid #d1d5db;
}
 .qk-ext-filter-bar {
 display: none !important;
}
 .idcss {
 font-size: 0px;
}
 .admin-sidebar {
 position: fixed;
 left: -260px;
 top: 0;
 height: 100vh;
 z-index: 1001;
 width: 240px;
 min-width: 240px;
 max-width: 240px;
 transition: left 0.3s ease;
}
 .admin-sidebar.active {
 left: 0;
}
 .sidebar-overlay.active {
 display: block;
}
 .sidebar-overlay {
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: rgba(0, 0, 0, 0.5);
 z-index: 1000;
 transition: opacity 0.3s ease;
}
 .sidebar-toggle {
 display: block;
 position: fixed;
 left: 10px;
 top: 10px;
 z-index: 1002;
 padding: 8px;
 background: white;
 border-radius: 4px;
 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
 .admin-container {
 flex-direction: column;
 gap: 15px;
}
 .admin-content {
 flex: 1;
 width: 100%;
 padding: 12px;
 box-sizing: border-box;
 box-shadow: 0 1px 3px rgba(0, 0, 0, 0);
}
 .section-header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 15px;
}
 .action-button {
 width: 100px;
 font-size: 14px;
}
 .table-container {
 margin: 0 -5px;
 padding: 0 5px;
}
 .admin-table {
 font-size: 14px;
}
 .admin-table.comment-manage th,  .admin-table.tag-manage th,  .admin-table.search-term-manage th,  .admin-table.tag-search-manage th {
 height: 40px !important;
 line-height: 1.4 !important;
 padding: 8px 6px !important;
 font-size: 14px !important;
 white-space: nowrap !important;
 overflow: hidden !important;
 text-overflow: ellipsis !important;
}
 .admin-table.comment-manage,  .admin-table.tag-manage,  .admin-table.search-term-manage,  .admin-table.tag-search-manage {
 width: 100% !important;
 font-size: 14px !important;
 table-layout: auto !important;
 min-width: auto !important;
}
 .admin-table.tag-manage th,  .admin-table.tag-manage td,  .admin-table.search-term-manage th,  .admin-table.search-term-manage td,  .admin-table.tag-search-manage th,  .admin-table.tag-search-manage td {
 padding: 8px 6px !important;
 font-size: 14px !important;
}
 .admin-table th:last-child,  .admin-table td:last-child {
 display: table-cell !important;
 text-align: right !important;
 min-width: 150px !important;
}
 .admin-card {
 padding: 15px;
 border-radius: 8px !important;
 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}
 .admin-card h3 {
 font-size: 16px !important;
 margin-bottom: 12px !important;
 color: #333 !important;
 font-weight: 600 !important;
}
 .table-container {
 overflow-x: auto !important;
 -webkit-overflow-scrolling: touch !important;
 margin: 0 -5px !important;
 padding: 0 5px !important;
 width: 100% !important;
 display: block !important;
 max-width: 100vw !important;
}
 .table-container {
 scrollbar-width: 10px !important;
 scrollbar-color: #888 #f1f1f1 !important;
}
 .table-container::-webkit-scrollbar {
 height: 10px !important;
 width: 10px !important;
}
 .table-container::-webkit-scrollbar-track {
 background: #f1f1f1 !important;
 border-radius: 5px !important;
 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1) !important;
}
 .table-container::-webkit-scrollbar-thumb {
 background: #888 !important;
 border-radius: 5px !important;
 border: 2px solid #f1f1f1 !important;
}
 .table-container::-webkit-scrollbar-thumb:hover {
 background: #555 !important;
}
 .table-container {
 overflow-x: scroll !important;
 -ms-overflow-style: scrollbar !important;
}
 .admin-table {
 min-width: 100% !important;
 width: auto !important;
}
 .admin-table-wrapper,  .admin-table-scroll {
 overflow-x: scroll !important;
 -webkit-overflow-scrolling: touch !important;
 width: 100% !important;
 max-width: 100vw !important;
 display: block !important;
}
 .admin-table-wrapper::-webkit-scrollbar,  .admin-table-scroll::-webkit-scrollbar {
 height: 10px !important;
 width: 10px !important;
}
 .admin-table-wrapper::-webkit-scrollbar-track,  .admin-table-scroll::-webkit-scrollbar-track {
 background: #f1f1f1 !important;
 border-radius: 5px !important;
 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1) !important;
}
 .admin-table-wrapper::-webkit-scrollbar-thumb,  .admin-table-scroll::-webkit-scrollbar-thumb {
 background: #888 !important;
 border-radius: 5px !important;
 border: 2px solid #f1f1f1 !important;
}
 .admin-table-wrapper::-webkit-scrollbar-thumb:hover,  .admin-table-scroll::-webkit-scrollbar-thumb:hover {
 background: #555 !important;
}
 .pagination-settings {
 display: none !important;
}
 .pagination-buttons .pagination-btn:first-child,  .pagination-buttons .pagination-btn:last-child {
 display: none !important;
}
 .pagination-buttons .pagination-select {
 display: none !important;
}
 .pagination-buttons {
 display: flex !important;
 justify-content: center !important;
 align-items: center !important;
 gap: 5px !important;
 flex-wrap: wrap !important;
 padding: 10px 0 !important;
}
 .pagination-buttons .pagination-btn.page-number {
 display: inline-block !important;
 min-width: 36px !important;
 height: 36px !important;
 line-height: 36px !important;
 text-align: center !important;
 font-size: 14px !important;
 border: 1px solid #ddd !important;
 border-radius: 4px !important;
 background-color: #fff !important;
 color: #333 !important;
 text-decoration: none !important;
}
 .pagination-buttons .pagination-btn.page-number.active {
 background-color: var(--primary-color) !important;
 color: #fff !important;
 border-color: var(--primary-color) !important;
}
 .tab-btn {
 margin-right: 0px
}
 .footer {
 width: 100% !important;
 margin-left: 0 !important;
 height: auto !important;
 line-height: 1.4 !important;
 padding: 10px 15px !important;
 padding-bottom: 25px !important;
}
 .footer p {
 margin: 0 !important;
 padding: 0 !important;
 line-height: 1.4 !important;
}
 .admin-content {
 padding-bottom: 0px !important;
 margin-bottom: 0px !important;
}
 .admin-table td {
 vertical-align: middle !important;
}
 .form-group {
 margin-bottom: 16px;
}
 input[type="text"],  input[type="email"],  input[type="password"],  textarea,  select {
 width: 100%;
 padding: 8px 12px;
 font-size: 14px;
 box-sizing: border-box;
}
 .btn-group {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
}
 .table-container {
 overflow-x: auto !important;
 -webkit-overflow-scrolling: touch;
 scrollbar-width: thin;
}
 .form-actions {
 display: flex;
 flex-direction: column;
 gap: 10px;
 margin-top: 20px;
}
 .form-actions .btn {
 width: 100%;
}
 .footer {
 margin: 0 auto;
}
 .thumbnail-upload-wrapper {
 display: flex;
 flex-direction: column;
 gap: 10px;
}
 .thumbnail-path code {
 display: none;
}
 .theme-switch {
 transform: scale(0.9);
}
 select {
 appearance: none;
 -webkit-appearance: none;
 padding-right: 30px !important;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
 background-repeat: no-repeat;
 background-position: right 10px center;
}
 .header-content {
 padding: 0 15px;
 width: 100%;
 display: flex;
 justify-content: space-between;
 align-items: center;
 flex-wrap: nowrap;
 gap: 10px;
}
 .header-right {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-shrink: 0;
 height: 100%;
 justify-content: center;
}
 .header-right .sidebar-toggle {
 display: flex;
 position: static;
 margin: 0;
 padding: 8px;
 width: 30px;
 height: 30px;
 background-color: #ffffff;
 border-radius: 4px;
 flex-shrink: 0;
 border: 1px solid #e0e0e0;
 cursor: pointer;
 transition: all 0.2s ease;
 box-shadow: none;
 align-items: center;
 justify-content: center;
}

 .header-right .sidebar-toggle:hover {
 background-color: #f5f5f5;
 transform: none;
 box-shadow: none;
}
 .header-right .sidebar-toggle svg {
 color: #666666;
 width: 20px;
 height: 20px;
}
 .header-content nav {
 display: none;
}
 .header-content .logo {
 font-size: 18px;
 font-weight: 600;
 flex-shrink: 0;
 white-space: nowrap;
}
 .sidebar-toggle {
 display: flex;
 position: static;
 margin: 0;
 padding: 8px;
 width: 36px;
 height: 36px;
}
 .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu {
 padding: 0;
 display: flex;
 flex-direction: column;
 align-items: stretch;
 width: 100%;
 max-width: 100%;
 margin: 0;
}
 .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu li {
 margin-bottom: 12px;
 width: 100%;
 max-width: 100%;
}
 .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu a {
 padding: 16px 20px !important;
 border-radius: 8px;
 font-size: 16px;
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 12px;
 background-color: #ffffff;
 border: 1px solid #e0e0e0;
 text-align: center;
 width: 100%;
 box-sizing: border-box;
 font-weight: 500;
 color: #495057;
}
 .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu a:hover,  .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu a.active {
 background-color: #007bff;
 border-color: #0056b3;
 color: white;
 transform: translateY(-2px);
 box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
}
 .dropdown-menu {
 animation: slideInRight 0.3s ease;
}
 @keyframes slideInRight {
 from {
 opacity: 0;
 transform: translateX(-10px);
}
 to {
 opacity: 1;
 transform: translateX(0);
}
}
 .admin-sidebar:not(.qk-sidebar-v2) .sidebar-menu .menu-icon {
 font-size: 20px;
 width: 36px;
 height: 36px;
 text-align: center;
 display: flex;
 align-items: center;
 justify-content: center;
 border-radius: 50%;
 background-color: rgba(0, 123, 255, 0.1);
}
 .admin-sidebar:not(.qk-sidebar-v2) h3 {
 text-align: center;
 margin-bottom: 30px;
 font-size: 20px;
 color: #212529;
 padding-bottom: 15px;
 border-bottom: 2px solid #dee2e6;
 font-weight: 600;
}
 .admin-sidebar.qk-sidebar-v2 .sidebar-menu-link,
 .admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu a.qk-sidebar-link {
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 gap: 14px !important;
}
 .admin-sidebar.qk-sidebar-v2 .sidebar-menu-link svg,
 .admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu a.qk-sidebar-link svg {
 display: block !important;
 align-self: center !important;
 flex-shrink: 0 !important;
}
 .admin-sidebar.qk-sidebar-v2 .sidebar-menu-link .link-text,
 .admin-sidebar.qk-sidebar-v2 .qk-sidebar-submenu a.qk-sidebar-link .link-text {
 display: flex !important;
 align-items: center !important;
 line-height: 1.2 !important;
}
 .admin-content {
 margin-left: 0;
 width: 100%;
 padding: 15px;
}
 .table-container {
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
 margin-bottom: 15px;
}
 table {
 width: 100%;
 font-size: 12px;
 min-width: 600px;
}
 table th,  table td {
 padding: 8px 6px !important;
 font-size: 12px;
 white-space: nowrap;
 height: auto !important;
 line-height: normal !important;
}
 .admin-table.category-manage th:nth-child(5),  .admin-table.category-manage td:nth-child(5) {
 display: none;
}
 .admin-table.comment-manage th:nth-child(4),  .admin-table.comment-manage td:nth-child(4),  .admin-table.comment-manage th:nth-child(5),  .admin-table.comment-manage td:nth-child(5) {
 display: none;
}
 table th:last-child,  table td:last-child {
 display: table-cell !important;
 min-width: 80px;
}
 table button {
 padding: 4px 8px;
 font-size: 11px;
 margin-right: 2px;
 margin-bottom: 2px;
 display: inline-block;
}
 table td {
 vertical-align: middle !important;
}
 .form-actions {
 display: flex;
 flex-direction: column;
 gap: 10px;
}
 .stat-cards {
 grid-template-columns: repeat(2, 1fr);
 gap: 15px;
 display: grid;
}
 .page-title {
 font-size: 18px;
 margin-bottom: 15px;
}
 .nav-title {
 font-size: 16px;
}
 .list-group-item {
 padding: 10px 12px;
}
 .search-box {
 width: 100%;
 margin-bottom: 15px;
}
 .pagination {
 margin-top: 15px;
 font-size: 12px;
}
 .pagination li a,  .pagination li span {
 padding: 6px 10px;
}
 .alert {
 margin-bottom: 15px;
 font-size: 13px;
 padding: 10px 15px;
}
 .image-upload {
 margin-bottom: 15px;
}
 .image-upload-preview {
 max-width: 100%;
 height: auto;
}
 .modal-content {
 width: 90%;
 margin: 20px auto;
 max-width: 500px;
}
 .chart-container {
 height: 250px;
 margin-bottom: 20px;
}
 .dropdown-menu {
 min-width: auto;
 width: 100%;
 left: auto;
 right: 0;
 margin-top: 5px;
 transform-origin: top right;
}
 .breadcrumb {
 padding: 8px 15px;
 font-size: 12px;
 overflow-x: auto;
 white-space: nowrap;
}
 .badge {
 padding: 3px 6px;
 font-size: 10px;
}
 .card {
 margin-bottom: 15px;
 border-radius: 8px;
 overflow: hidden;
}
 .card-title {
 font-size: 16px;
 margin-bottom: 10px;
}
 .card-body {
 padding: 15px;
}
 .panel {
 margin-bottom: 15px;
 border-radius: 8px;
 overflow: hidden;
}
 .panel-title {
 font-size: 15px;
 padding: 10px 15px;
}
 .panel-body {
 padding: 15px;
}
 .dropdown-content {
 left: auto;
 right: 0;
 transform-origin: top right;
}
 .admin-sidebar .dropdown-menu {
 position: absolute;
 left: auto;
 right: 0;
 top: 0;
 transform-origin: top right;
}
 .switch {
 position: relative;
 display: inline-block;
 width: 40px;
 height: 20px;
}
 .switch input {
 opacity: 0;
 width: 0;
 height: 0;
}
 .slider {
 position: absolute;
 cursor: pointer;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: #ccc;
 transition: .4s;
 border-radius: 20px;
}
 .slider:before {
 position: absolute;
 content: "";
 height: 16px;
 width: 16px;
 left: 2px;
 bottom: 2px;
 background-color: white;
 transition: .4s;
 border-radius: 50%;
}
 input:checked+.slider {
 background-color: var(--primary-color);
}
 input:focus+.slider {
 box-shadow: 0 0 1px var(--primary-color);
}
 .admin-sidebar a.active {
 border-radius: 0px;
}
 input:checked+.slider:before {
 transform: translateX(20px);
}
 .margin-left {
 margin-left: 0px;
}
 .section-header .btn-danger {
 display: inline-flex !important;
}
 .section-header .btn-primary {
 display: inline-flex !important;
}
 .tagsesch1 {
 display: none
}
 .main {
 margin: 0 auto 0 0px;
 width: calc(100% - 0px);
}
 #article-form .form-row[style*="display: flex"] {
 flex-direction: column !important;
 gap: 15px !important;
}
 #article-form .form-row[style*="display: flex"] .form-group {
 width: 100% !important;
 margin-bottom: 0 !important;
}
 #article-form .form-row[style*="grid-template-columns: 1fr 1fr 1fr 1fr"] {
 grid-template-columns: 1fr 1fr !important;
 gap: 10px !important;
}
 #article-form .form-row[style*="grid-template-columns: 1fr 1fr"] .form-group {
 margin-bottom: 0 !important;
}
 .keywords-hint {
 display: none !important;
}
 .pagination-select {
 display: none !important;
}
}
.user-dropdown {
	position: relative;
	display: flex;
	align-items: center;
}
.user-dropdown-trigger {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	cursor: pointer;
	border-radius: 8px;
	transition: background-color 0.2s;
}
.user-dropdown-trigger .user-name {
	font-size: 14px;
	font-weight: 500;
	color: #334155;
	max-width: 100px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.user-dropdown-trigger .user-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #e2e8f0;
}
.user-dropdown-trigger .dropdown-arrow {
	color: #64748b;
	transition: transform 0.2s;
}
.user-dropdown-trigger.active .dropdown-arrow {
	transform: rotate(180deg);
}
.user-dropdown-menu {
	position: absolute;
	top: calc(100% + 8px);
	right: 25px;
	min-width: 240px;
	background-color: #fff;
	border-radius: 15px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
	border: 1px solid #e2e8f0;
	padding: 10px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.2s ease;
	z-index: 10000;
}
.user-dropdown-menu.show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
 .user-dropdown-menu::before {
 content: '';
 position: absolute;
 top: -6px;
 right: 20px;
 width: 12px;
 height: 12px;
 background-color: #fff;
 border-left: 1px solid #e2e8f0;
 border-top: 1px solid #e2e8f0;
 transform: rotate(45deg);
}
.dropdown-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	border-radius: 8px;
}
.dropdown-header .points-label {
	font-size: 13px;
	color: #64748b;
}
.dropdown-header .points-value {
	font-size: 15px;
	font-weight: 600;
	color: #7c3aed;
}
.dropdown-divider {
	height: 1px;
	background-color: #e2e8f0;
	margin: 8px 0;
}
.dropdown-form {
	padding: 12px 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.password-input-wrapper {
	position: relative;
	display: flex;
	align-items: center;
}
.password-input-wrapper .dropdown-input {
	padding-right: 40px;
}
.password-toggle {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #94a3b8;
	transition: color 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
}
.password-toggle:hover {
	color: var(--primary-color);
}
.dropdown-input {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	box-sizing: border-box;
	transition: border-color 0.2s;
}
.dropdown-input:focus {
	outline: none;
	border-color: var(--primary-color);
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1);
}
 .dropdown-input::placeholder {
 color: #94a3b8;
}
.dropdown-btn {
	width: 100%;
	padding: 10px;
	background: var(--primary-color);
	color: #fff;
	border: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s;
}
.dropdown-btn:hover {
 filter: alpha(opacity:80);
	opacity: 0.8;
}
.dropdown-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	color: #334155;
	font-size: 14px;
	text-decoration: none;
	transition: background-color 0.2s;
}
.dropdown-item:hover {
	background-color: #f8fafc;
}
.dropdown-item.logout-item {
	color: #dc2626;
}
.dropdown-item.logout-item:hover {
	background-color: #fef2f2;
}
.dropdown-item svg {
	flex-shrink: 0;
}

:is(.qk-scroll-host-horizontal, .counter-table-scroll) {
 overflow-x: auto;
 scrollbar-width: none;
 -ms-overflow-style: none;
 position: relative;
}

:is(.qk-scroll-host-horizontal, .counter-table-scroll)::-webkit-scrollbar {
 display: none;
}

:is(.qk-custom-scrollbar-container, .counter-custom-scrollbar-container) {
 position: relative;
 width: 100%;
 margin-top: -7px;
 display: flex;
 justify-content: center;
}

:is(.qk-custom-scrollbar-track, .counter-custom-scrollbar-track) {
 width: 400px;
 height: 12px;
 background: linear-gradient(180deg, #e6edf5 0%, #d9e2ec 100%);
 border-radius: 12px;
 position: relative;
 box-shadow: inset 0 1px 2px rgba(15, 23, 42, .16);
}

:is(.qk-custom-scrollbar-thumb, .counter-custom-scrollbar-thumb) {
 width: 150px;
 height: 11px;
 background: linear-gradient(180deg, #f2f6fb 0%, #e0e8f2 55%, #ced9e6 100%);
 border-radius: 12px;
 position: absolute;
 top: 0;
 left: 0;
 box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 1px 3px rgba(15, 23, 42, .24);
 cursor: pointer;
 will-change: left;
 transition: background .18s ease, box-shadow .18s ease;
}

:is(.qk-custom-scrollbar-thumb, .counter-custom-scrollbar-thumb):is(:hover, .dragging) {
 background: linear-gradient(180deg, var(--primary-dark, var(--primary-color)) 0%, var(--primary-color) 58%, var(--primary-light, var(--primary-color)) 100%);
 box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 2px 5px rgba(37, 99, 235, .35);
}

:is(.qk-menu-scroll-content, .counter-column-menu-content) {
 max-height: 360px;
 overflow-y: auto;
 padding: 0;
 scrollbar-width: none;
 -ms-overflow-style: none;
}

:is(.qk-menu-has-scroll, .counter-menu-has-scroll) :is(.qk-menu-scroll-content, .counter-column-menu-content) {
 padding-right: 0;
}

:is(.qk-menu-scroll-content, .counter-column-menu-content)::-webkit-scrollbar {
 width: 0;
 height: 0;
}

:is(.qk-menu-vscroll, .counter-column-menu-vscroll) {
 position: absolute;
 right: 3px;
 top: 20px;
 bottom: 20px;
 width: 8px;
 background: linear-gradient(90deg, #e9eff6 0%, #e0e8f1 52%, #d5dfeb 100%);
 border-radius: 999px;
 box-shadow: inset 0 1px 1px rgba(15, 23, 42, .06), inset 0 -1px 1px rgba(255, 255, 255, .55);
 z-index: 2;
}

:is(.qk-menu-vthumb, .counter-column-menu-vthumb) {
 position: absolute;
 left: 0;
 top: 0;
 width: 8px;
 height: 80px;
 background: linear-gradient(90deg, #f1f6fc 0%, #e4ebf3 52%, #d7e0eb 100%);
 border-radius: 999px;
 cursor: pointer;
 box-shadow: inset 0 1px 0 rgba(255, 255, 255, .88), inset 0 -1px 0 rgba(203, 213, 225, .38), 0 1px 3px rgba(15, 23, 42, .14), 0 0 0 1px rgba(148, 163, 184, .12);
 will-change: transform;
 transition: background .2s ease, box-shadow .2s ease;
}

:is(.qk-menu-vthumb, .counter-column-menu-vthumb):is(:hover, .dragging) {
 background: linear-gradient(90deg, var(--primary-dark, var(--primary-color)) 0%, var(--primary-color) 58%, var(--primary-light, var(--primary-color)) 100%);
 box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 2px 5px rgba(37, 99, 235, .35);
}
 @media (max-width: 768px) {
 .user-dropdown-trigger .user-name {
 display: none;
}
 .user-dropdown-trigger {
 padding: 4px;
}
 .user-dropdown-trigger .user-avatar {
 width: 28px;
 height: 28px;
}
 .user-dropdown-menu {
 min-width: 200px;
 right: -10px;
}
}
 @media (max-width: 768px) {
 .header-content {
 padding: 0 10px !important;
}
 .header-content > div:first-child {
 display: flex !important;
 align-items: center !important;
 gap: 6px !important;
 flex: 1 1 auto !important;
 min-width: 0 !important;
 white-space: nowrap !important;
}
 .header-content > div:first-child .logo {
 font-size: 17px !important;
 line-height: 1 !important;
 white-space: nowrap !important;
}
 .header-right {
 gap: 8px !important;
}
 .header-right .user-dropdown {
 display: flex !important;
 align-items: center !important;
}
 .header-right .user-dropdown-trigger {
 height: 36px !important;
 padding: 2px 7px 2px 2px !important;
 border: 1px solid #d6dde7 !important;
 border-radius: 999px !important;
 background: #f8fafc !important;
 box-shadow: none !important;
 gap: 6px !important;
}
 .header-right .user-dropdown-trigger:active {
 transform: scale(0.98) !important;
}
 .header-right .user-dropdown-trigger .user-avatar {
 width: 30px !important;
 height: 30px !important;
 border: 1px solid #dbe2ea !important;
}
 .header-right .user-dropdown-trigger .dropdown-arrow {
 width: 14px !important;
 height: 14px !important;
 color: #64748b !important;
}
 .header-right .sidebar-toggle {
 width: 36px !important;
 height: 36px !important;
 padding: 0 !important;
 border: 1px solid #d6dde7 !important;
 border-radius: 999px !important;
 background: #f8fafc !important;
 box-shadow: none !important;
}
 .header-right .sidebar-toggle svg {
 width: 17px !important;
 height: 17px !important;
 color: #475569 !important;
}
 .header-right .sidebar-toggle:active {
 transform: scale(0.98) !important;
}
 .user-dropdown-menu {
 right: 0 !important;
 top: calc(100% + 10px) !important;
 border-radius: 12px !important;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16) !important;
}
}

/* ========== 强制统一收缩状态下所有导航项的悬停样式 ========== */
body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link,
body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.top-level,
body.sidebar-collapsed .admin-sidebar a.sidebar-section-title {
	transform: none !important;
	border: none !important;
	border-color: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	height: 45px !important;
	min-height: 45px !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
}

body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link:hover,
body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.top-level:hover,
body.sidebar-collapsed .admin-sidebar a.sidebar-section-title:hover {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #ffffff !important;
	transform: translateY(-1px) !important;
	border: 1px solid transparent !important;
	border-color: rgba(255, 255, 255, 0.06) !important;
	box-shadow: none !important;
	border-radius: 14px !important;
}

body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.active,
body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.top-level.active,
body.sidebar-collapsed .admin-sidebar a.sidebar-section-title.active {
	background: color-mix(in srgb, var(--primary-color), transparent 72%) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	transform: translateY(-1px) !important;
	border: 1px solid transparent !important;
	border-color: color-mix(in srgb, var(--primary-color), transparent 60%) !important;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary-color), transparent 50%), 0 4px 16px color-mix(in srgb, var(--primary-color), transparent 82%) !important;
	border-radius: 14px !important;
}

body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.active::before,
body.sidebar-collapsed .admin-sidebar a.sidebar-menu-link.top-level.active::before {
	display: none !important;
}

body.sidebar-collapsed .admin-sidebar.qk-sidebar-v2 .sidebar-menu {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* ========== 强制统一收缩状态下所有图标颜色 ========== */
body.sidebar-collapsed .admin-sidebar svg,
body.sidebar-collapsed .admin-sidebar a svg,
body.sidebar-collapsed .admin-sidebar .sidebar-section-icon,
body.sidebar-collapsed .admin-sidebar .sidebar-menu-link svg {
	opacity: 0.92 !important;
	color: rgba(226, 232, 240, 0.92) !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link:hover svg,
body.sidebar-collapsed .admin-sidebar .sidebar-section-title:hover svg {
	opacity: 0.96 !important;
	color: #ffffff !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-menu-link.active svg,
body.sidebar-collapsed .admin-sidebar .sidebar-section-title.active svg {
	opacity: 1 !important;
	color: #ffffff !important;
}

body.sidebar-collapsed .admin-sidebar .menu-dropdown > a::before,
body.sidebar-collapsed .admin-sidebar .menu-dropdown > a::after {
	content: none !important;
	display: none !important;
}

body.sidebar-collapsed .admin-sidebar .sidebar-section-title:hover .sidebar-section-icon {
	opacity: 1 !important;
	color: #ffffff !important;
}

body.sidebar-collapsed .admin-sidebar .dropdown-content.popup-menu {
	width: 150px !important;
	min-width: 150px !important;
	max-width: 150px !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	border-left: 0 !important;
	box-shadow: none !important;
}

body.sidebar-collapsed .admin-sidebar .dropdown-content.popup-menu a.sidebar-menu-link {
	width: 100% !important;
	padding: 0 12px !important;
	justify-content: flex-start !important;
	gap: 8px !important;
	border-radius: 14px !important;
	border: 1px solid transparent !important;
	transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
}

body.sidebar-collapsed .admin-sidebar .dropdown-content.popup-menu a.sidebar-menu-link svg {
	width: 16px !important;
	height: 16px !important;
}

.qk-hover-tip {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99999;
	max-width: 520px;
	padding: 10px 12px;
	font-size: 13px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.96);
	background: rgba(0, 0, 0, 0.78);
	border-radius: 10px;
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.12s ease;
	white-space: pre-wrap;
	word-break: break-word;
}

.qk-hover-tip::after {
	content: "";
	position: absolute;
	left: var(--qk-arrow-left, 50%);
	transform: translateX(-50%);
	border-style: solid;
	border-color: transparent;
}

.qk-hover-tip.dir-down::after {
	bottom: -8px;
	border-width: 8px 8px 0 8px;
	border-style: solid;
	border-color: rgba(0, 0, 0, 0.78) transparent transparent transparent;
}

.qk-hover-tip.dir-up::after {
	top: -8px;
	border-width: 0 8px 8px 8px;
	border-color: transparent transparent rgba(0, 0, 0, 0.78) transparent;
}

.qk-hover-tip.show {
	opacity: 1;
}

.admin-table.comment-manage .comment-content .comment-content-text[data-qk-tip] {
	display: inline;
	line-height: 1.4 !important;
	vertical-align: middle;
	cursor: default;
}
