/* pages/main/journal-map/index.less */
.container {
	width: 100%;
	height: 100vh;
	position: fixed;
	overflow: hidden;

	.map {
		width: 100%;
		height: 100%;
	}

	.custom-callout {
		width: fit-content;
		min-width: 350rpx;
		max-width: 450rpx;
		background: #fff;
		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, .15);
		border-radius: 6rpx;

		.callout-content {
			display: flex;
			padding: 8rpx 16rpx 8rpx 8rpx;
			align-items: flex-start;

			.thumb-container {
				width: 72rpx;
				height: 72rpx;
				position: relative;
				flex-shrink: 0;
				margin-right: 12rpx;
				overflow: hidden;
				border-radius: 6rpx;

				.thumb {
					width: 100%;
					height: 100%;
				}

				.count-badge {
					top: 4rpx;
					right: 4rpx;
					color: #fff;
					padding: 2rpx 6rpx;
					position: absolute;
					font-size: 20rpx;
					background: rgba(0, 0, 0, .7);
					border-radius: 8rpx;
				}
			}

			.text-container {
				flex: 1;
				display: flex;
				overflow: hidden;
				flex-direction: column;

				.location {
					color: #333;
					overflow: hidden;
					font-size: 30rpx;
					white-space: nowrap;
					text-overflow: ellipsis;
					margin-bottom: 4rpx;
				}

				.date-count {
					display: flex;

					.date {
						color: #999;
						font-size: 24rpx;
						margin-right: 16rpx;
					}

					.count {
						color: var(--theme-wx);
						font-size: 24rpx;
						font-weight: 600;
					}
				}
			}
		}
	}

	.loading {
		top: 50%;
		left: 50%;
		z-index: 1000;
		position: fixed;
		transform: translate(-50%, -50%);

		.loading-text {
			color: #666;
			padding: 24rpx 48rpx;
			background: #FFF;
			border-radius: 8rpx;
			box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, .15);
		}
	}
}