-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathterms.html
More file actions
327 lines (309 loc) · 27 KB
/
terms.html
File metadata and controls
327 lines (309 loc) · 27 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Terms of Service – Serializd Tracker Bot</title>
<link rel="icon" type="image/x-icon" href="images/logo1.png">
<meta content="#14e8e8" data-react-helmet="true" name="theme-color"/>
<meta name="title" content="Terms of Service – Serializd Tracker Bot"/>
<meta name="description" content="Terms of Service for Serializd Tracker Bot – Your TV Show Tracking Companion for Discord."/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="https://serializdtrackerbot.github.io/terms"/>
<meta property="og:title" content="Terms of Service – Serializd Tracker Bot"/>
<meta property="og:description" content="Terms of Service for Serializd Tracker Bot."/>
<meta property="og:image" content="../images/logo1.png"/>
<script src="https://cdn.tailwindcss.com"></script>
<style>
@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.gradient-bg{background:linear-gradient(-45deg,#14e8e8,#5df2f2,#00b3b3,#047979);background-size:400% 400%;animation:gradient 15s ease infinite}
#scroll-progress{position:fixed;top:0;left:0;width:0%;height:4px;background:linear-gradient(90deg,#14e8e8,#5df2f2,#00b3b3);z-index:9999;transition:width .1s ease}
.feature-card{background:rgba(255,255,255,.03);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);transition:all .2s ease-out;box-shadow:0 8px 32px rgba(0,0,0,.1)}
.animated-bg{position:absolute;width:100%;height:100%;overflow:hidden;z-index:0;pointer-events:none}
.bg-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;animation:float-orb 20s infinite ease-in-out}
.bg-orb-1{width:400px;height:400px;background:linear-gradient(45deg,#14e8e8,#047979);top:0%;left:5%;animation-delay:0s}
.bg-orb-2{width:300px;height:300px;background:linear-gradient(135deg,#5df2f2,#00b3b3);top:30%;right:5%;animation-delay:7s}
@keyframes float-orb{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(50px,-50px) scale(1.1)}66%{transform:translate(-30px,30px) scale(.9)}}
.gradient-btn{position:relative;background:linear-gradient(45deg,#14e8e8,#047979);overflow:hidden;transition:all .3s ease}
.gradient-btn::before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,.3),transparent);transform:rotate(45deg);transition:all .6s ease}
.gradient-btn:hover::before{left:100%}
.gradient-btn:hover{transform:scale(1.05);box-shadow:0 10px 40px rgba(20,232,232,.4)}
.nav-blur{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#dark-mode-toggle{position:fixed;bottom:30px;right:30px;width:60px;height:60px;border-radius:50%;background:linear-gradient(45deg,#14e8e8,#047979);border:none;cursor:pointer;z-index:1000;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 4px 20px rgba(20,232,232,.4);transition:all .3s ease}
#dark-mode-toggle:hover{transform:scale(1.1) rotate(10deg);box-shadow:0 6px 30px rgba(20,232,232,.6)}
body.light-mode{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%)!important;color:#1a1a1a!important}
body.light-mode .feature-card{background:rgba(255,255,255,.7)!important;border-color:rgba(0,0,0,.15)!important;box-shadow:0 8px 32px rgba(0,0,0,.08)!important}
body.light-mode nav{background:rgba(255,255,255,.5)!important;border-bottom-color:rgba(0,0,0,.1)!important}
body.light-mode .text-white,body.light-mode h1,body.light-mode h2,body.light-mode h3,body.light-mode h4,body.light-mode p,body.light-mode li,body.light-mode span:not(.text-transparent){color:#1a1a1a!important}
body.light-mode .text-white\/70{color:rgba(26,26,26,.8)!important}
body.light-mode .bg-white\/10{background:rgba(0,0,0,.05)!important}
body.light-mode #scroll-progress{background:linear-gradient(90deg,#047979,#14e8e8,#5df2f2)!important}
body.light-mode .animated-bg{opacity:.3}
@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.animate-fade-in{animation:fadeIn .2s ease-out forwards}
</style>
</head>
<body class="bg-black text-white overflow-y-auto [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-[#14e8e8]">
<div id="scroll-progress"></div>
<button id="dark-mode-toggle" title="Toggle theme">🌙</button>
<!-- NAV -->
<nav class="fixed w-full z-50 top-0">
<div class="nav-blur bg-black/30 border-b border-white/10">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-20">
<a href="index.html" class="flex items-center gap-2">
<img src="images/logo1.png" alt="Serializd Tracker Bot Logo" class="w-10 h-10 rounded-lg"/>
<span class="text-2xl font-bold text-white">Serializd Tracker Bot</span>
</a>
<div class="hidden md:flex gap-8">
<a href="index.html" class="text-white/70 hover:text-white transition-colors">Home</a>
<a href="index.html#features" class="text-white/70 hover:text-white transition-colors">Features</a>
<a href="index.html#commands" class="text-white/70 hover:text-white transition-colors">Commands</a>
<a href="terms.html" class="text-[#14e8e8] font-semibold">Terms</a>
<a href="privacy-policy.html" class="text-white/70 hover:text-white transition-colors">Privacy</a>
</div>
<div class="md:hidden"><button onclick="toggleMobileMenu()" class="text-white p-2"><svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path class="menu-icon" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg></button></div>
<a href="https://discord.com/oauth2/authorize?client_id=1476015649775157369" class="hidden md:block"><button class="bg-white/10 hover:bg-white/20 px-6 py-2 rounded-lg transition-all duration-300">Add to Discord</button></a>
</div>
<div id="mobileMenu" class="hidden md:hidden"><div class="px-2 pt-2 pb-3 space-y-1 bg-black/50 rounded-lg mt-2">
<a href="index.html" class="block px-3 py-2 text-white/70 hover:text-white">Home</a>
<a href="index.html#features" class="block px-3 py-2 text-white/70 hover:text-white">Features</a>
<a href="index.html#commands" class="block px-3 py-2 text-white/70 hover:text-white">Commands</a>
<a href="terms.html" class="block px-3 py-2 text-[#14e8e8] font-semibold">Terms</a>
<a href="privacy-policy.html" class="block px-3 py-2 text-white/70 hover:text-white">Privacy</a>
<a href="https://discord.com/oauth2/authorize?client_id=1476015649775157369" class="block px-3 py-2 text-white/70 hover:text-white">Add to Discord</a>
</div></div>
</div>
</div>
</nav>
<!-- HERO -->
<section class="min-h-[40vh] relative overflow-hidden flex items-center pt-20">
<div class="animated-bg">
<div class="bg-orb bg-orb-1"></div>
<div class="bg-orb bg-orb-2"></div>
</div>
<div class="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_var(--tw-gradient-stops))] from-[#14e8e8]/30 via-black to-black"></div>
<div class="relative max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-20 text-center">
<div class="w-14 h-14 gradient-bg rounded-xl flex items-center justify-center text-3xl mx-auto mb-6">📜</div>
<h1 class="text-5xl md:text-6xl font-bold mb-4">Terms of Service</h1>
<p class="text-xl text-white/70">Effective date: April 26, 2026</p>
<p class="text-white/50 mt-2 text-sm">These terms govern your use of Serializd Tracker Bot on Discord.</p>
</div>
</section>
<!-- CONTENT -->
<section class="py-20 relative">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8">
<!-- 1 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">1️⃣</div>
<h2 class="text-2xl font-bold">Acceptance of Terms</h2>
</div>
<p class="text-white/70 leading-relaxed">By inviting Serializd Tracker Bot ("the Bot") to your Discord server or by using any of its slash commands, you ("Server Administrator" or "User") agree to be bound by these Terms of Service ("Terms") and our <a href="privacy-policy.html" class="text-[#14e8e8] hover:underline">Privacy Policy</a>. If you do not agree to these Terms, please remove the Bot from your server and stop using it immediately.</p>
<p class="text-white/70 leading-relaxed mt-4">These Terms apply to all users of the Bot, including server administrators who invite and configure it, moderators who manage tracked users, and regular members who interact with its commands.</p>
</div>
<!-- 2 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">2️⃣</div>
<h2 class="text-2xl font-bold">What the Bot Does</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">Serializd Tracker Bot provides the following functionality inside Discord servers:</p>
<ul class="text-white/70 space-y-2 list-none">
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Automatically polls public Serializd.com diary entries for usernames configured by server administrators, and posts them to a designated Discord channel approximately every 5 minutes.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Provides interactive slash commands for browsing Serializd profiles, viewing server and global statistics, and managing bot configuration.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Announces upcoming and newly aired episodes for shows on your server's watching list.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Allows users to voluntarily link their social media profiles (Serializd, Letterboxd, Instagram, X, and others) via the /sharelink command.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Generates weekly and monthly recap embeds summarising server watch activity.</li>
</ul>
<p class="text-white/70 leading-relaxed mt-4">The Bot only accesses <strong class="text-white">publicly available</strong> data on Serializd.com. It does not interact with private or authenticated Serializd accounts.</p>
<p class="text-white/70 leading-relaxed mt-4">Approximately 14 days after the Bot joins your server, it may send a one-time message to your configured commands channel asking if you'd like to leave a review on Top.gg. This is a single automated message and will not be repeated.</p>
</div>
<!-- 3 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">3️⃣</div>
<h2 class="text-2xl font-bold">Eligibility</h2>
</div>
<p class="text-white/70 leading-relaxed">You must be at least 13 years old to use the Bot, in line with Discord's minimum age requirement. By using the Bot you confirm that you meet this requirement. Server administrators are responsible for ensuring their server community's use of the Bot is appropriate for their membership's age group.</p>
</div>
<!-- 4 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">4️⃣</div>
<h2 class="text-2xl font-bold">Administrator Responsibilities</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">Server administrators who add and configure the Bot take on the following responsibilities:</p>
<ul class="text-white/70 space-y-2 list-none">
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Consent for tracked usernames.</strong> You should only add Serializd usernames to the tracking list with the knowledge of the people whose diaries will be posted publicly in your server. Tracking someone's public diary without their awareness, in a context where they would find it objectionable, is your responsibility to avoid.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Channel permissions.</strong> You are responsible for configuring post channels appropriately, including who can view them.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Role permissions.</strong> The Bot's permission system (admin, mod, user groups) should be configured to prevent unauthorised changes to your server's bot settings.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Compliance with Discord's policies.</strong> All use of the Bot within your server must comply with <a href="https://discord.com/terms" target="_blank" class="text-[#14e8e8] hover:underline">Discord's Terms of Service</a> and <a href="https://discord.com/guidelines" target="_blank" class="text-[#14e8e8] hover:underline">Community Guidelines</a>.</span></li>
</ul>
</div>
<!-- 5 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">5️⃣</div>
<h2 class="text-2xl font-bold">Prohibited Uses</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">You may not use the Bot to:</p>
<ul class="text-white/70 space-y-2 list-none">
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Violate any applicable law or regulation.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Harass, stalk, monitor, or collect information about a person in a way that could cause them harm or distress.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Attempt to reverse-engineer, exploit, or abuse the Bot's API interactions, database, or backend infrastructure.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Intentionally spam commands in a way that degrades the Bot's performance or availability for other servers.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Circumvent the Bot's built-in rate limits or cooldown system through automated scripts or macros.</li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span> Submit false, misleading, or malicious data via any command, including /sharelink or /adduser.</li>
</ul>
</div>
<!-- 6 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">6️⃣</div>
<h2 class="text-2xl font-bold">Discord Permissions</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">The Bot requests the following Discord permissions to function correctly. We request only what is needed:</p>
<ul class="text-white/70 space-y-2 list-none">
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Send Messages & Embed Links</strong> - To post diary entries and command responses.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Read Message History</strong> - To update existing group diary embeds in-place.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Edit & Delete Messages</strong> - To rotate and update live group diary embeds.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Use External Emojis & Add Reactions</strong> - For interactive UI elements and rating displays.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Attach Files</strong> - For file-based outputs where needed.</span></li>
</ul>
<p class="text-white/70 leading-relaxed mt-4">The Bot does <strong class="text-white">not</strong> read general message content in your server. It only processes responses to its own slash command interactions.</p>
</div>
<!-- 7 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">7️⃣</div>
<h2 class="text-2xl font-bold">Availability & Modifications</h2>
</div>
<p class="text-white/70 leading-relaxed">The Bot is provided free of charge on an <strong class="text-white">"as-is"</strong> and <strong class="text-white">"as-available"</strong> basis. We do not guarantee uninterrupted availability. Planned or unplanned downtime may occur due to hosting, third-party API outages (e.g. Serializd.com, TVMaze, Discord), or maintenance.</p>
<p class="text-white/70 leading-relaxed mt-4">We reserve the right to add, modify, or remove features at any time. We may update these Terms at any time by posting a new version on this page. Continued use of the Bot after a change is posted constitutes your acceptance of the updated Terms.</p>
</div>
<!-- 8 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">8️⃣</div>
<h2 class="text-2xl font-bold">Limitation of Liability</h2>
</div>
<p class="text-white/70 leading-relaxed">To the fullest extent permitted by applicable law, Serializd Tracker Bot and its developers shall not be liable for any indirect, incidental, special, consequential, or punitive damages, including but not limited to: loss of data, missed diary entries due to API downtime, or any harm arising from your use of or inability to use the Bot.</p>
<p class="text-white/70 leading-relaxed mt-4">The Bot relies on third-party public APIs (Serializd.com and TVMaze). We are not responsible for the accuracy, availability, or content of data returned by those services.</p>
</div>
<!-- 9 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">9️⃣</div>
<h2 class="text-2xl font-bold">Termination & Bans</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">We reserve the right to restrict, suspend, or permanently ban access to the Bot for any server or user that violates these Terms - including adding specific guilds to a ban list that prevents re-invitation.</p>
<p class="text-white/70 leading-relaxed">You may stop using the Bot at any time by removing it from your server. Upon removal, all data associated with your server is automatically and permanently deleted within <strong class="text-white">48 hours</strong>. See our <a href="privacy-policy.html" class="text-[#14e8e8] hover:underline">Privacy Policy</a> for full details on data deletion.</p>
</div>
<!-- 10 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">🔟</div>
<h2 class="text-2xl font-bold">Third-Party Services</h2>
</div>
<p class="text-white/70 leading-relaxed mb-4">The Bot's functionality depends on the following third-party services. Your use of the Bot is subject to their respective terms as well:</p>
<ul class="text-white/70 space-y-2 list-none">
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Discord</strong> - <a href="https://discord.com/terms" target="_blank" class="text-[#14e8e8] hover:underline">discord.com/terms</a></span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Serializd.com</strong> - Public diary data is fetched from Serializd's public API. We are not affiliated with Serializd.</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">TVMaze</strong> - Show metadata and episode data is sourced from the public TVMaze API (<a href="https://www.tvmaze.com/api" target="_blank" class="text-[#14e8e8] hover:underline">tvmaze.com/api</a>).</span></li>
<li class="flex items-start gap-2"><span class="text-[#14e8e8] mt-1">▸</span><span><strong class="text-white">Top.gg</strong> - The Bot is listed on Top.gg for discovery purposes.</span></li>
</ul>
</div>
<!-- 11 -->
<div class="feature-card p-8 rounded-2xl">
<div class="flex items-center gap-4 mb-5">
<div class="w-10 h-10 gradient-bg rounded-lg flex items-center justify-center text-xl flex-shrink-0">✉️</div>
<h2 class="text-2xl font-bold">Contact</h2>
</div>
<p class="text-white/70 leading-relaxed mb-5">For questions, concerns, or reports related to these Terms, please reach out through our official Discord support server:</p>
<a href="https://discord.gg/hmrHbWCpcP" target="_blank" class="inline-flex items-center gradient-bg gradient-btn px-6 py-3 rounded-lg font-semibold hover:opacity-90 transition-opacity">Join Support Server →</a>
</div>
</div>
</section>
<!-- BOTTOM BUTTONS -->
<section class="py-16 relative">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="feature-card p-10 rounded-2xl text-center">
<h2 class="text-3xl font-bold mb-3">Ready to get started?</h2>
<p class="text-white/70 mb-8 text-lg">Add the bot to your Discord server and start tracking your favourite TV shows today.</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center flex-wrap">
<a href="https://discord.com/oauth2/authorize?client_id=1476015649775157369" target="_blank"
class="inline-flex items-center justify-center gradient-bg gradient-btn px-8 py-4 rounded-xl font-semibold text-white hover:opacity-90 transition-opacity duration-300">
➕ Add to Discord
</a>
<a href="https://discord.gg/hmrHbWCpcP" target="_blank"
class="inline-flex items-center justify-center bg-[#5865F2] hover:bg-[#4752C4] px-8 py-4 rounded-xl font-semibold text-white transition-colors duration-300">
💬 Join Support Server
</a>
<a href="privacy-policy.html"
class="inline-flex items-center justify-center bg-white/10 hover:bg-white/20 px-8 py-4 rounded-xl font-semibold text-white transition-colors duration-300">
🔒 Privacy Policy
</a>
<a href="index.html"
class="inline-flex items-center justify-center bg-white/10 hover:bg-white/20 px-8 py-4 rounded-xl font-semibold text-white transition-colors duration-300">
🏠 Back to Home
</a>
</div>
</div>
</div>
</section>
<!-- FOOTER -->
<footer class="text-white py-16 border-t border-white/10">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-3 gap-12">
<div><img class="h-10 mb-6" src="images/logo1.png" alt="Serializd Tracker Bot Logo"/><p class="text-lg text-white/70">Serializd Tracker Bot is the ultimate tool for sharing and discussing TV shows in your Discord server!</p></div>
<div><h4 class="text-xl font-semibold mb-4">Quick Links</h4><ul class="space-y-4">
<li><a href="index.html" class="text-white/70 hover:text-white">Home</a></li>
<li><a href="index.html#features" class="text-white/70 hover:text-white">Features</a></li>
<li><a href="index.html#commands" class="text-white/70 hover:text-white">Commands</a></li>
<li><a href="terms.html" class="text-[#14e8e8] hover:text-white">Terms of Service</a></li>
<li><a href="privacy-policy.html" class="text-white/70 hover:text-white">Privacy Policy</a></li>
</ul></div>
<div><h4 class="text-xl font-semibold mb-4">Follow Us</h4><ul class="space-y-4">
<li><a href="https://discord.com/oauth2/authorize?client_id=1476015649775157369" class="text-white/70 hover:text-white">Invite</a></li>
<li><a href="https://discord.gg/hmrHbWCpcP" class="text-white/70 hover:text-white">Discord</a></li>
<li><a href="https://github.com/Kjerne/Serializd-Discord-Bot" class="text-white/70 hover:text-white">GitHub</a></li>
</ul></div>
</div>
<div class="mt-12 border-t border-white/20 pt-6 text-center">
<p class="text-sm text-white/50">© 2026 Serializd Tracker Bot. All rights reserved. Not affiliated with Discord Inc. or Serializd. • <a href="terms.html" class="hover:text-white/70">Terms</a> • <a href="privacy-policy.html" class="hover:text-white/70">Privacy</a></p>
</div>
</div>
</footer>
<script>
function toggleMobileMenu() {
const m = document.getElementById("mobileMenu"), i = document.querySelector(".menu-icon");
if (m.classList.contains("hidden")) { m.classList.remove("hidden"); m.classList.add("animate-fade-in"); i.setAttribute("d","M6 18L18 6M6 6l12 12"); }
else { m.classList.add("hidden"); m.classList.remove("animate-fade-in"); i.setAttribute("d","M4 6h16M4 12h16M4 18h16"); }
}
document.addEventListener("click", e => {
const m = document.getElementById("mobileMenu"), b = document.querySelector(".md\\:hidden button");
if (b && !m.classList.contains("hidden") && !m.contains(e.target) && !b.contains(e.target)) {
m.classList.add("hidden"); m.classList.remove("animate-fade-in"); document.querySelector(".menu-icon").setAttribute("d","M4 6h16M4 12h16M4 18h16");
}
});
window.addEventListener('scroll', () => {
const sp = document.getElementById('scroll-progress');
const st = window.pageYOffset || document.documentElement.scrollTop;
const sh = document.documentElement.scrollHeight - document.documentElement.clientHeight;
sp.style.width = ((st / sh) * 100) + '%';
});
const dmt = document.getElementById('dark-mode-toggle'), body = document.body;
const saved = localStorage.getItem('theme') || 'dark';
body.classList.add(saved === 'dark' ? 'dark-mode' : 'light-mode');
dmt.textContent = saved === 'dark' ? '🌙' : '☀️';
dmt.addEventListener('click', () => {
const dark = body.classList.contains('dark-mode');
body.classList.remove('dark-mode','light-mode');
body.classList.add(dark ? 'light-mode' : 'dark-mode');
dmt.textContent = dark ? '☀️' : '🌙';
localStorage.setItem('theme', dark ? 'light' : 'dark');
});
</script>
</body>
</html>