<template>
    <view class="agreement-screen">
        <view class="agreement-header">
            <view class="agreement-back" @click="handleBack">
                <text class="agreement-back-icon">←</text>
            </view>
            <text class="agreement-title">用户协议</text>
        </view>

        <view class="agreement-content">
            <view class="agreement-section">
                <text class="agreement-section-title">一、协议的接受与修改</text>
                <text class="agreement-text">
                    欢迎使用壹梵起名服务。本协议是您与壹梵起名之间关于使用壹梵起名服务所订立的协议。请您仔细阅读本协议，您点击"同意"按钮后，本协议即构成对双方有约束力的法律文件。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">二、服务说明</text>
                <text class="agreement-text">
                    壹梵起名向用户提供包括但不限于宝宝起名、姓名测试、公司起名、改名建议、择吉日等服务。具体服务内容以平台实际提供为准。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">三、用户账号</text>
                <text class="agreement-text">
                    1. 用户需要注册账号才能使用本服务。用户应当提供真实、准确、完整的个人信息。
                </text>
                <text class="agreement-text">
                    2. 用户应妥善保管账号和密码，对账号下的所有行为负责。
                </text>
                <text class="agreement-text">
                    3. 用户不得将账号转让、出借或以其他方式提供给第三方使用。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">四、用户行为规范</text>
                <text class="agreement-text">
                    用户在使用本服务时，应遵守国家法律法规，不得利用本服务从事违法违规活动，包括但不限于：
                </text>
                <text class="agreement-text">
                    1. 发布、传播违法违规信息；
                </text>
                <text class="agreement-text">
                    2. 侵犯他人知识产权或其他合法权益；
                </text>
                <text class="agreement-text">
                    3. 干扰或破坏服务的正常运行；
                </text>
                <text class="agreement-text">
                    4. 其他违反法律法规或本协议的行为。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">五、知识产权</text>
                <text class="agreement-text">
                    本服务中的所有内容，包括但不限于文字、图片、软件、程序等，其知识产权均归壹梵起名或相关权利人所有。未经授权，用户不得擅自使用。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">六、免责声明</text>
                <text class="agreement-text">
                    1. 本服务提供的起名、测名等内容仅供参考，不构成任何承诺或保证。
                </text>
                <text class="agreement-text">
                    2. 因不可抗力、网络故障等原因导致的服务中断或数据丢失，壹梵起名不承担责任。
                </text>
                <text class="agreement-text">
                    3. 用户因使用本服务产生的任何纠纷，应依法解决。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">七、协议的变更与终止</text>
                <text class="agreement-text">
                    壹梵起名有权根据需要修改本协议，修改后的协议将在平台上公布。用户继续使用服务即视为接受修改后的协议。
                </text>
            </view>

            <view class="agreement-section">
                <text class="agreement-section-title">八、其他</text>
                <text class="agreement-text">
                    本协议的解释、效力及纠纷的解决，适用中华人民共和国法律。如有争议，双方应友好协商解决；协商不成的，任何一方均可向壹梵起名所在地人民法院提起诉讼。
                </text>
            </view>

            <view class="agreement-footer">
                <text class="agreement-footer-text">壹梵起名</text>
                <text class="agreement-footer-text">生效日期：2024年1月1日</text>
            </view>
        </view>
    </view>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router';

const router = useRouter();

const handleBack = () => {
    router.back();
};
</script>

<style scoped>
.agreement-screen {
    min-height: 100vh;
    width: 100%;
    background: #fdfbf7 url("https://www.transparenttextures.com/patterns/rice-paper.png");
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

.agreement-header {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    padding: 16px 20px;
    background: rgba(253, 251, 247, 0.95);
    border-bottom: 1px solid #eaddcf;
    backdrop-filter: blur(10px);
    flex-shrink: 0;
}

.agreement-back {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-right: 12px;
    flex-shrink: 0;
}

.agreement-back-icon {
    font-size: 24px;
    color: #8b2323;
    font-weight: bold;
}

.agreement-title {
    font-size: 18px;
    font-weight: 500;
    color: #2c2c2c;
    font-family: SimSun, "Songti SC", serif;
}

.agreement-content {
    flex: 1;
    padding: 24px 20px 40px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
    box-sizing: border-box;
}

.agreement-section {
    margin-bottom: 24px;
    width: 100%;
}

.agreement-section-title {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #8b2323;
    margin-bottom: 12px;
    font-family: SimSun, "Songti SC", serif;
    word-wrap: break-word;
    word-break: break-word;
}

.agreement-text {
    display: block;
    font-size: 14px;
    line-height: 1.8;
    color: #4a4a4a;
    margin-bottom: 8px;
    font-family: SimSun, "Songti SC", serif;
    word-wrap: break-word;
    word-break: break-word;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.agreement-footer {
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid #eaddcf;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.agreement-footer-text {
    display: block;
    font-size: 13px;
    color: #8a8a8a;
    font-family: SimSun, "Songti SC", serif;
}
</style>
