.cloud-db-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100vh;
	background: linear-gradient(180deg, #f0f2ff 0%, #f5f4f9 40%, #faf9fe 100%);
}

.cloud-db-header {
	flex-shrink: 0;
	background-color: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	padding-bottom: 0;
	border-bottom: 1rpx solid rgba(170, 170, 255, 0.1);
}

.custom-navbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20rpx 30rpx;
	box-sizing: border-box;
	position: relative;
}

.navbar-left {
	display: flex;
	align-items: center;
	min-width: 160rpx;
}

.custom-navbar-icon {
	font-size: 44rpx;
	color: #333;
}

.navbar-title {
	font-size: 36rpx;
	font-weight: 600;
	color: #1a1a2e;
}

.navbar-right {
	width: auto;
	min-width: 80rpx;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.navbar-before-title {
	font-size: 26rpx;
	color: #6c63ff;
	margin-left: 8rpx;
}

.navbar-right-text {
	font-size: 28rpx;
	color: #6c63ff;
	font-weight: 500;
}

/* 菜单 */
.menu-open {
	color: #6c63ff;
}

.menu-card {
	position: absolute;
	top: 80rpx;
	right: 20rpx;
	background: #fff;
	border-radius: 16rpx;
	box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
	padding: 12rpx 0;
	z-index: 100;
	min-width: 200rpx;
}

.menu-card-item {
	padding: 20rpx 32rpx;
	font-size: 28rpx;
	color: #333;
}

.menu-card-item:active {
	background: #f5f6fa;
}

.solid-line {
	height: 1rpx;
	background: #eee;
	margin: 4rpx 20rpx;
}

.file-count {
	font-size: 24rpx;
	color: #999;
	font-weight: 400;
}

/* 分类切换 Tab */
.category-tabs {
	display: flex;
	padding: 10rpx 30rpx 0;
	gap: 40rpx;
	border-bottom: 2rpx solid #eee;
}

.category-tab {
	font-size: 30rpx;
	color: #999;
	padding-bottom: 20rpx;
	position: relative;
	font-weight: 500;
	transition: color 0.3s;
}

.category-tab.active {
	color: #6c63ff;
	font-weight: 600;
}

.category-tab.active::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 48rpx;
	height: 6rpx;
	background: linear-gradient(90deg, #6c63ff, #aaaaff);
	border-radius: 3rpx;
}

/* 内容区域 */
.cloud-db-content {
	flex: 1;
	min-height: 0;
	padding: 20rpx 30rpx;
	box-sizing: border-box;
}

/* 区块 */
.section-block {
	background: #ffffff;
	border-radius: 20rpx;
	padding: 24rpx;
	margin-bottom: 20rpx;
	box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}

.section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16rpx;
}

.section-title {
	display: flex;
	align-items: center;
	gap: 12rpx;
	font-size: 32rpx;
	font-weight: 600;
	color: #1a1a2e;
}

.section-title .iconfont {
	font-size: 36rpx;
	color: #6c63ff;
}

.section-actions {
	display: flex;
	align-items: center;
	gap: 10rpx;
}

.action-btn {
	display: flex;
	align-items: center;
	gap: 6rpx;
	padding: 10rpx 20rpx;
	background: rgba(108, 99, 255, 0.06);
	color: #6c63ff;
	border-radius: 20rpx;
	font-size: 24rpx;
	font-weight: 500;
	transition: all 0.15s ease;
}

.action-btn:active {
	background: rgba(108, 99, 255, 0.12);
}

.section-divider {
	height: 2rpx;
	margin: 4rpx 0 20rpx;
}

/* 空状态 */
.empty-tip {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60rpx 0;
	color: #bbb;
	font-size: 26rpx;
	gap: 16rpx;
}

.empty-tip .iconfont {
	font-size: 80rpx;
	color: #ddd;
}

/* 文件网格 */
.file-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 16rpx;
}

.file-item {
	width: calc(33.33% - 12rpx);
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20rpx 10rpx;
	border-radius: 16rpx;
	background: #f8f9fc;
	border: 2rpx solid transparent;
	transition: all 0.2s;
	box-sizing: border-box;
}

.file-item:active {
	border-color: #6c63ff;
	background: rgba(108, 99, 255, 0.04);
}

.file-icon {
	width: 80rpx;
	height: 80rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 16rpx;
	margin-bottom: 10rpx;
}

.file-icon.is-directory {
	background: rgba(255, 170, 0, 0.12);
}

.file-icon.is-directory .iconfont {
	font-size: 48rpx;
	color: #ffa500;
}

.file-icon.is-file {
	background: rgba(108, 99, 255, 0.1);
}

.file-icon.is-file .iconfont {
	font-size: 44rpx;
	color: #6c63ff;
}

.file-name {
	font-size: 24rpx;
	color: #333;
	text-align: center;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
	margin-bottom: 6rpx;
}

.file-meta {
	display: flex;
	gap: 8rpx;
	align-items: center;
}

.file-type-tag {
	font-size: 20rpx;
	color: #999;
	background: #f0f0f0;
	padding: 2rpx 10rpx;
	border-radius: 8rpx;
}

.file-size {
	font-size: 20rpx;
	color: #bbb;
}

/* 数据表列表 */
.table-list {
	display: flex;
	flex-direction: column;
	gap: 12rpx;
}

.table-item {
	display: flex;
	align-items: center;
	padding: 20rpx;
	border-radius: 14rpx;
	background: #f8f9fc;
	border: 2rpx solid transparent;
	transition: all 0.2s;
}

.table-item:active {
	border-color: #6c63ff;
	background: rgba(108, 99, 255, 0.03);
}

.table-icon {
	width: 64rpx;
	height: 64rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(108, 99, 255, 0.08);
	border-radius: 14rpx;
	margin-right: 20rpx;
	flex-shrink: 0;
}

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

.table-name {
	font-size: 28rpx;
	font-weight: 600;
	color: #1a1a2e;
	margin-bottom: 4rpx;
}

.table-desc {
	font-size: 22rpx;
	color: #999;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.table-meta {
	display: flex;
	align-items: center;
	gap: 6rpx;
	flex-shrink: 0;
}

.table-rows {
	font-size: 22rpx;
	color: #bbb;
}

/* 团队管理 */
.team-manage-block {
	cursor: pointer;
}

.team-count {
	font-size: 24rpx;
	color: #999;
}

.team-selector {
	padding: 0 0 20rpx;
}

.team-scroll {
	white-space: nowrap;
}

.team-chip {
	display: inline-block;
	padding: 12rpx 28rpx;
	margin-right: 16rpx;
	border-radius: 30rpx;
	font-size: 26rpx;
	color: #666;
	background: #f0f2f5;
	transition: all 0.2s;
}

.team-chip.active {
	color: #fff;
	background: #6c63ff;
	font-weight: 500;
}

.team-info {
	margin-top: 14rpx;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12rpx;
}

.team-type-tag {
	font-size: 22rpx;
	color: #6c63ff;
	background: rgba(108, 99, 255, 0.1);
	padding: 6rpx 16rpx;
	border-radius: 8rpx;
	font-weight: 500;
}

.team-desc-text {
	font-size: 24rpx;
	color: #999;
	line-height: 1.5;
	flex: 1;
	min-width: 0;
}

.select-team-tip {
	padding: 80rpx 0;
}

/* ===== 弹窗样式 ===== */
.popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.4);
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.popup-card {
	width: 600rpx;
	background: #fff;
	border-radius: 30rpx;
	padding: 40rpx 30rpx;
	box-sizing: border-box;
	position: relative;
	max-height: 80vh;
	display: flex;
	flex-direction: column;
}

.close-popup-card {
	position: absolute;
	top: 20rpx;
	right: 20rpx;
	width: 50rpx;
	height: 50rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}

.close-popup-card .iconfont {
	font-size: 40rpx;
	color: #999;
}

.popup-title {
	font-size: 34rpx;
	font-weight: 600;
	color: #1a1a2e;
	margin-bottom: 30rpx;
	text-align: center;
}

.new-folder-name {
	font-size: 26rpx;
	color: #666;
	margin-bottom: 10rpx;
}

.create-folder-name {
	margin-bottom: 20rpx;
}

.create-folder-name input {
	width: 100%;
	height: auto;
	padding: 20rpx;
	box-sizing: border-box;
	border: 1rpx solid #e0e0e0;
	border-radius: 16rpx;
	font-size: 28rpx;
	background: #f9fafb;
}

.create-folder-name input:focus {
	border-color: #6c63ff;
	background: #fff;
}

.nf-path-label {
	font-size: 24rpx;
	color: #999;
	margin-bottom: 8rpx;
}

.nf-path-display {
	font-size: 24rpx;
	color: #6c63ff;
	background: rgba(108, 99, 255, 0.06);
	padding: 12rpx 16rpx;
	border-radius: 10rpx;
	margin-bottom: 20rpx;
}

.option-wrapper {
	display: flex;
	gap: 20rpx;
	justify-content: flex-end;
	margin-top: 10rpx;
}

.opt-btn {
	padding: 16rpx 40rpx;
	border-radius: 30rpx;
	font-size: 28rpx;
	font-weight: 500;
}

.opt-cancel {
	color: #999;
	background: #f0f2f5;
}

.opt-confirm {
	color: #fff;
	background: #6c63ff;
}

/* 团队管理弹窗 */
.team-manage-body {
	flex: 1;
	min-height: 0;
	max-height: 500rpx;
	margin-bottom: 20rpx;
}

.member-list {
	display: flex;
	flex-direction: column;
	gap: 10rpx;
}

.member-item {
	display: flex;
	align-items: center;
	padding: 16rpx;
	border-radius: 14rpx;
	background: #f8f9fc;
}

.member-avatar {
	width: 70rpx;
	height: 70rpx;
	border-radius: 50%;
	overflow: hidden;
	margin-right: 16rpx;
	flex-shrink: 0;
}

.member-avatar image {
	width: 100%;
	height: 100%;
}

.default-avatar {
	width: 100%;
	height: 100%;
	background: #ccc;
	display: flex;
	align-items: center;
	justify-content: center;
}

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

.member-name {
	font-size: 28rpx;
	font-weight: 500;
	color: #333;
}

.member-label {
	font-size: 22rpx;
	color: #999;
	margin-top: 4rpx;
}

.member-actions {
	flex-shrink: 0;
}

.member-role {
	font-size: 22rpx;
	padding: 6rpx 16rpx;
	border-radius: 20rpx;
}

.member-role.owner {
	color: #e6a23c;
	background: rgba(230, 162, 60, 0.1);
}

.member-role.admin {
	color: #6c63ff;
	background: rgba(108, 99, 255, 0.1);
}

.member-role.member {
	color: #67c23a;
	background: rgba(103, 194, 58, 0.1);
}

.member-actions-right {
	display: flex;
	gap: 8rpx;
}

.member-action-btn {
	font-size: 20rpx;
	padding: 8rpx 14rpx;
	border-radius: 16rpx;
}

.set-admin {
	color: #6c63ff;
	border: 1rpx solid #6c63ff;
}

.demote-admin {
	color: #e6a23c;
	border: 1rpx solid #e6a23c;
}

.remove-member {
	color: #f56c6c;
	border: 1rpx solid #f56c6c;
}

.invite-section {
	border-top: 1rpx solid #eee;
	padding-top: 20rpx;
}

.invite-input-wrapper {
	display: flex;
	align-items: center;
	gap: 16rpx;
}

.invite-input {
	flex: 1;
	height: auto;
	padding: 18rpx 20rpx;
	box-sizing: border-box;
	border: 1rpx solid #e0e0e0;
	border-radius: 30rpx;
	font-size: 26rpx;
	background: #f9fafb;
}

.invite-btn {
	background: #6c63ff;
	color: #fff;
	font-size: 24rpx;
	padding: 14rpx 32rpx;
}

/* 搜索结果列表 */
.search-result-list {
	margin-top: 16rpx;
	border-radius: 14rpx;
	overflow: hidden;
	background: #f8f9fc;
}

.search-result-item {
	display: flex;
	align-items: center;
	padding: 18rpx 20rpx;
	border-bottom: 1rpx solid #eee;
}

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

.search-result-item:active {
	background: rgba(108, 99, 255, 0.05);
}

.result-avatar {
	width: 64rpx;
	height: 64rpx;
	border-radius: 50%;
	flex-shrink: 0;
	margin-right: 16rpx;
}

.result-default-avatar {
	width: 64rpx;
	height: 64rpx;
	border-radius: 50%;
	background: linear-gradient(135deg, #6c63ff, #6db3ff);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-right: 16rpx;
}

.result-info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4rpx;
}

.result-name {
	font-size: 28rpx;
	color: #333;
	font-weight: 500;
}

.result-email {
	font-size: 22rpx;
	color: #999;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.result-add-btn {
	flex-shrink: 0;
	font-size: 24rpx;
	color: #6c63ff;
	padding: 10rpx 24rpx;
	border: 1rpx solid #6c63ff;
	border-radius: 20rpx;
}

.search-empty {
	margin-top: 16rpx;
	text-align: center;
	font-size: 24rpx;
	color: #bbb;
	padding: 20rpx 0;
}

.folder-null {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60rpx 0;
	color: #bbb;
	font-size: 26rpx;
	gap: 12rpx;
}

.folder-null .iconfont {
	font-size: 64rpx;
	color: #ddd;
}

/* 删除团队 */
.delete-team-section {
	border-top: 1rpx solid #eee;
	padding-top: 20rpx;
	margin-top: 10rpx;
}

.delete-team-btn {
	text-align: center;
	padding: 18rpx;
	font-size: 26rpx;
	color: #e74c3c;
	background: rgba(231, 76, 60, 0.06);
	border-radius: 14rpx;
	border: 1rpx solid rgba(231, 76, 60, 0.2);
}

.delete-team-btn:active {
	background: rgba(231, 76, 60, 0.12);
}

/* 修改团队信息 */
.edit-team-section {
	border-top: 1rpx solid #eee;
	padding-top: 20rpx;
	margin-top: 10rpx;
}

.edit-team-btn {
	text-align: center;
	padding: 18rpx;
	font-size: 26rpx;
	color: #6c63ff;
	background: rgba(108, 99, 255, 0.06);
	border-radius: 14rpx;
	border: 1rpx solid rgba(108, 99, 255, 0.2);
}

.edit-team-btn:active {
	background: rgba(108, 99, 255, 0.12);
}

.edit-team-form {
	margin-bottom: 10rpx;
}

.form-label {
	font-size: 26rpx;
	color: #666;
	margin-bottom: 8rpx;
	margin-top: 18rpx;
}

.text-btn {
	padding: 8rpx 20rpx;
	border-radius: 30rpx;
	font-size: 14px;
	font-weight: 500;
}

/* ===== 上传文件弹窗 ===== */
.upload-path-label {
	font-size: 26rpx;
	color: #666;
	margin-bottom: 10rpx;
}

.upload-path-hint {
	font-size: 22rpx;
	color: #999;
	margin-bottom: 20rpx;
	text-align: center;
}

/* ===== 加载动画 ===== */
.loading-area {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60rpx 0;
	gap: 16rpx;
}

.loading-spinner {
	width: 56rpx;
	height: 56rpx;
	border: 4rpx solid #e8e8e8;
	border-top-color: #6c63ff;
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

.loading-text {
	font-size: 24rpx;
	color: #999;
}

/* ===== 数据库标签 ===== */
.db-tag {
	display: inline-block;
	font-size: 20rpx;
	font-weight: 500;
	padding: 2rpx 12rpx;
	border-radius: 8rpx;
	margin-left: 10rpx;
	vertical-align: middle;
}

.db-tag.tag-personal {
	color: #6c63ff;
	background: rgba(108, 99, 255, 0.08);
	border: 1rpx solid rgba(108, 99, 255, 0.2);
}

.db-tag.tag-team {
	color: #67c23a;
	background: rgba(103, 194, 58, 0.08);
	border: 1rpx solid rgba(103, 194, 58, 0.2);
}

/* ===== 上传数据库弹窗 ===== */
.upload-db-hint {
	font-size: 22rpx;
	color: #999;
	margin-bottom: 20rpx;
	text-align: center;
}

.upload-file-area {
	padding: 40rpx;
	border: 2rpx dashed #d0d0d0;
	border-radius: 16rpx;
	background: #f9fafb;
	text-align: center;
	margin-bottom: 20rpx;
}

.upload-file-area:active {
	border-color: #6c63ff;
	background: rgba(108, 99, 255, 0.03);
}

.selected-file {
	font-size: 26rpx;
	color: #6c63ff;
	font-weight: 500;
	word-break: break-all;
}

.upload-hint {
	font-size: 24rpx;
	color: #bbb;
}