@extends('layouts.app')

@section('title', 'Điều Khoản Sử Dụng - Truyện Hay')
@section('description', 'Điều khoản và điều kiện sử dụng dịch vụ đọc truyện online tại Truyện Hay')

@section('content')
<div class="bg-gradient-to-br from-primary/10 via-purple-500/5 to-background-dark border-b border-gray-800">
    <div class="container mx-auto px-4 lg:px-8 max-w-4xl py-16 text-center">
        <div class="inline-flex items-center justify-center w-20 h-20 rounded-full bg-primary/20 mb-6">
            <span class="material-symbols-outlined text-5xl text-primary">gavel</span>
        </div>
        <h1 class="text-4xl md:text-5xl font-extrabold text-white mb-4">Điều Khoản Sử Dụng</h1>
        <p class="text-gray-400 text-lg">Cập nhật lần cuối: {{ date('d/m/Y') }}</p>
    </div>
</div>

<div class="container mx-auto px-4 lg:px-8 max-w-4xl py-12">
    <div class="bg-surface-dark rounded-2xl border border-gray-800 overflow-hidden">
        <div class="p-8 md:p-12 prose prose-invert prose-primary max-w-none">

            <div class="bg-primary/10 border-l-4 border-primary rounded-r-lg p-6 mb-8">
                <p class="text-gray-300 text-sm leading-relaxed m-0">
                    Chào mừng bạn đến với <strong class="text-white">Truyện Hay</strong>. Bằng việc truy cập và sử dụng website, bạn đồng ý tuân thủ các điều khoản và điều kiện được quy định dưới đây. Vui lòng đọc kỹ trước khi sử dụng dịch vụ.
                </p>
            </div>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">1</span>
                    Chấp Nhận Điều Khoản
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Khi truy cập và sử dụng Truyện Hay, bạn xác nhận rằng:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Bạn đã đủ 13 tuổi trở lên hoặc có sự đồng ý của phụ huynh/người giám hộ</li>
                        <li>Bạn đồng ý tuân thủ tất cả các điều khoản và điều kiện được nêu trong tài liệu này</li>
                        <li>Bạn có trách nhiệm bảo mật thông tin tài khoản của mình</li>
                        <li>Bạn sẽ không sử dụng dịch vụ cho mục đích vi phạm pháp luật</li>
                    </ul>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">2</span>
                    Quyền Sở Hữu Trí Tuệ
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Tất cả nội dung trên Truyện Hay, bao gồm nhưng không giới hạn:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Văn bản, hình ảnh, biểu tượng, logo và thiết kế giao diện</li>
                        <li>Phần mềm, mã nguồn và cơ sở dữ liệu</li>
                        <li>Tên miền, thương hiệu và nhận diện thương hiệu</li>
                    </ul>
                    <p class="mt-4">Đều thuộc quyền sở hữu của Truyện Hay hoặc các đối tác cấp phép. Nghiêm cấm mọi hành vi sao chép, phân phối, sửa đổi hoặc khai thác thương mại mà không có sự cho phép bằng văn bản.</p>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">3</span>
                    Quy Định Sử Dụng
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p class="font-semibold text-white">Người dùng ĐƯỢC PHÉP:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Đọc, tìm kiếm và khám phá nội dung trên website</li>
                        <li>Tạo tài khoản và quản lý thông tin cá nhân</li>
                        <li>Đánh giá, bình luận và tương tác với cộng đồng</li>
                        <li>Chia sẻ link truyện trên mạng xã hội</li>
                    </ul>

                    <p class="font-semibold text-white mt-6">Người dùng KHÔNG ĐƯỢC PHÉP:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Sử dụng bot, crawler hoặc công cụ tự động để thu thập dữ liệu</li>
                        <li>Can thiệp, phá hoại hoặc gây quá tải hệ thống</li>
                        <li>Đăng tải nội dung vi phạm pháp luật, xúc phạm hoặc spam</li>
                        <li>Mạo danh, lừa đảo hoặc xâm phạm quyền riêng tư người khác</li>
                        <li>Sao chép, tải xuống hàng loạt nội dung để phân phối lại</li>
                    </ul>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">4</span>
                    Tài Khoản Người Dùng
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Khi đăng ký tài khoản tại Truyện Hay:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Bạn phải cung cấp thông tin chính xác và đầy đủ</li>
                        <li>Bạn có trách nhiệm bảo mật mật khẩu và thông tin đăng nhập</li>
                        <li>Mỗi người chỉ được tạo một tài khoản, nghiêm cấm tạo tài khoản ảo</li>
                        <li>Truyện Hay có quyền khóa/xóa tài khoản vi phạm mà không cần thông báo trước</li>
                    </ul>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">5</span>
                    Miễn Trừ Trách Nhiệm
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Truyện Hay cung cấp dịch vụ trên cơ sở "NGUYÊN TRẠNG" và không đảm bảo:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Dịch vụ luôn hoạt động liên tục, không gián đoạn</li>
                        <li>Nội dung hoàn toàn chính xác, đầy đủ và cập nhật</li>
                        <li>Website không có lỗi, virus hoặc thành phần gây hại</li>
                    </ul>
                    <p class="mt-4">Chúng tôi không chịu trách nhiệm cho bất kỳ tổn thất nào phát sinh từ việc sử dụng hoặc không thể sử dụng dịch vụ.</p>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">6</span>
                    Quảng Cáo và Liên Kết
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Truyện Hay có thể:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Hiển thị quảng cáo từ các đối tác thứ ba</li>
                        <li>Chứa liên kết đến các website bên ngoài</li>
                        <li>Thu thập dữ liệu thông qua cookie và công nghệ tương tự</li>
                    </ul>
                    <p class="mt-4">Chúng tôi không chịu trách nhiệm về nội dung và chính sách của các website bên thứ ba.</p>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">7</span>
                    Thay Đổi Điều Khoản
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Truyện Hay có quyền:</p>
                    <ul class="list-disc list-inside space-y-2 text-gray-400">
                        <li>Sửa đổi, bổ sung hoặc thay thế các điều khoản bất kỳ lúc nào</li>
                        <li>Thông báo thay đổi qua website hoặc email</li>
                        <li>Yêu cầu người dùng chấp nhận điều khoản mới để tiếp tục sử dụng</li>
                    </ul>
                    <p class="mt-4">Việc bạn tiếp tục sử dụng dịch vụ sau khi có thay đổi được coi là chấp nhận điều khoản mới.</p>
                </div>
            </section>

            <section class="mb-10">
                <h2 class="text-2xl font-bold text-white mb-4 flex items-center gap-3">
                    <span class="flex items-center justify-center w-10 h-10 rounded-full bg-primary/20 text-primary">8</span>
                    Luật Áp Dụng
                </h2>
                <div class="pl-13 space-y-4 text-gray-300">
                    <p>Các điều khoản này được điều chỉnh bởi pháp luật Việt Nam. Mọi tranh chấp phát sinh sẽ được giải quyết thông qua thương lượng, hòa giải hoặc theo quy định của pháp luật.</p>
                </div>
            </section>

            <div class="bg-gradient-to-r from-primary/10 to-purple-500/10 border border-primary/20 rounded-xl p-6 mt-12">
                <h3 class="text-xl font-bold text-white mb-3 flex items-center gap-2">
                    <span class="material-symbols-outlined text-primary">contact_support</span>
                    Liên Hệ Hỗ Trợ
                </h3>
                <p class="text-gray-300 mb-4">Nếu bạn có bất kỳ câu hỏi nào về Điều Khoản Sử Dụng, vui lòng liên hệ:</p>
                <div class="space-y-2 text-gray-400">
                    <p class="flex items-center gap-2">
                        <span class="material-symbols-outlined text-sm text-primary">mail</span>
                        Email: <a href="mailto:support@truyenhay.com" class="text-primary hover:underline">support@truyenhay.com</a>
                    </p>
                </div>
            </div>

        </div>
    </div>

    <div class="mt-8 text-center">
        <a href="{{ route('home') }}" class="inline-flex items-center gap-2 px-6 py-3 bg-primary hover:bg-primary-hover text-white font-bold rounded-lg transition-all">
            <span class="material-symbols-outlined">arrow_back</span>
            Quay lại trang chủ
        </a>
    </div>
</div>
@endsection