// pages/main/travel-detail/index.less

.travel-detail {
	width: 100vw;
	box-sizing: border-box;
	background: var(--theme-bg-page);

	.content {
		display: flex;
		padding-top: 48rpx;
		flex-direction: column;

		.section {
			margin-top: 32rpx;

			> .title {
				color: var(--theme-text-secondary);
				padding: 0 32rpx;
				font-size: 28rpx;
				line-height: 64rpx;
			}

			&.status {
				display: flex;
				margin-top: 24rpx;
				justify-content: center;
			}

			&.title {
				color: var(--theme-text-primary);
				padding: 24rpx;
				font-size: 40rpx;
				text-align: center;
				margin-top: 24rpx;
				background: var(--theme-bg-card);
				box-shadow: 0 2px 12px var(--theme-shadow-light);
				font-weight: bold;
				line-height: 1.5;
			}

			&.locations {

				.header {
					padding: 16rpx 32rpx;

					.left-actions {
						gap: 16rpx;
						display: flex;
						align-items: center;

						.type-picker {

							.picker-button {
								gap: 8rpx;
								color: var(--theme-wx);
								border: 1px solid var(--theme-wx);
								display: flex;
								padding: 14rpx 24rpx 14rpx 32rpx;
								font-size: 26rpx;
								background: var(--theme-bg-card);
								align-items: center;
								border-radius: 16rpx;
							}
						}
					}
				}

				.location {
					.thumb {
						width: 96rpx;
						height: 96rpx;
						border: 1px solid var(--theme-border-light);
						overflow: hidden;
						background: var(--theme-bg-page);
						flex-shrink: 0;
						border-radius: 16rpx;
					}

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

					.thumb-placeholder {
						color: var(--theme-text-secondary);
						width: 100%;
						height: 100%;
						display: flex;
						font-size: 24rpx;
						background: var(--theme-bg-page);
						align-items: center;
						justify-content: center;
					}

					.note {
						width: 2em;
					}

					.description {
						column-gap: 24rpx;
						color: var(--theme-text-secondary);
						display: flex;
						flex-wrap: wrap;
						font-size: 26rpx;

						.item {
							gap: 12rpx;
							width: fit-content;
							display: flex;
							padding: 2rpx 4rpx;
							align-items: center;
							background: var(--theme-bg-page);

							.stars {
								gap: 8rpx;
								display: flex;
							}
						}
					}
				}
			}

			&.action {
				gap: 24rpx;
				display: flex;
				padding: 24rpx 16rpx 128rpx 16rpx;

				.edit {
					flex: 2;
				}

				.delete {
					flex: 1;
				}
			}
		}
	}
}

.delete-dialog {
	padding: 16rpx 0;

	.tips {
		color: var(--theme-text-secondary);
		font-size: 28rpx;
		line-height: 1.5;
		margin-bottom: 24rpx;
	}
}