nodebb-theme-flawless-rp 1.0.5 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,468 +1,471 @@
1
1
  /* ============================================
2
- FLAWLESS ROLEPLAY — Underground Criminal Empire
3
- NodeBB Theme Override
4
- ============================================ */
2
+ FLAWLESS ROLEPLAY — Underground Criminal Empire
3
+ NodeBB Theme Override
4
+ ============================================ */
5
5
 
6
+ /* Google Fonts Import */
7
+ @import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700&family=Barlow:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
6
8
 
7
9
  :root {
8
- /* ---- Backgrounds ---- */
9
- --bs-body-bg: #0a0a0b;
10
- --bs-body-color: #e5e7eb;
11
- --bs-secondary-bg: #111114;
12
- --bs-tertiary-bg: #18181c;
13
-
14
- /* ---- Surfaces ---- */
15
- --frp-surface: #111114;
16
- --frp-surface-hover: #18181c;
17
- --frp-surface-active: #1e1e24;
18
- --frp-surface-elevated: #1a1a1f;
19
-
20
- /* ---- Borders ---- */
21
- --frp-border: #1e1e24;
22
- --frp-border-subtle: #161619;
23
- --frp-border-strong: #2a2a32;
24
-
25
- /* ---- Primary — Gold/Amber (power, money, authority) ---- */
26
- --frp-primary: #F59E0B;
27
- --frp-primary-hover: #D97706;
28
- --frp-primary-light: rgba(245, 158, 11, 0.15);
29
- --frp-primary-glow: 0 0 20px rgba(245, 158, 11, 0.3);
30
- --bs-primary: #F59E0B;
31
- --bs-primary-rgb: 245, 158, 11;
32
- --bs-link-color: #F59E0B;
33
- --bs-link-hover-color: #D97706;
34
-
35
- /* ---- Danger — Red ---- */
36
- --frp-danger: #EF4444;
37
- --frp-danger-light: rgba(239, 68, 68, 0.15);
38
-
39
- /* ---- Success — Green ---- */
40
- --frp-success: #22C55E;
41
- --frp-success-light: rgba(34, 197, 94, 0.15);
42
-
43
- /* ---- Info — Blue (law enforcement) ---- */
44
- --frp-info: #3B82F6;
45
- --frp-info-light: rgba(59, 130, 246, 0.15);
46
-
47
- /* ---- Warning ---- */
48
- --frp-warning: #F59E0B;
49
- --frp-warning-light: rgba(245, 158, 11, 0.15);
50
-
51
- /* ---- Muted ---- */
52
- --frp-muted: #6B7280;
53
- --frp-muted-light: #9CA3AF;
54
-
55
- /* ---- Faction Colors ---- */
56
- --frp-faction-lspd: #3B82F6;
57
- --frp-faction-fbi: #1D4ED8;
58
- --frp-faction-sasd: #92400E;
59
- --frp-faction-ares: #7C3AED;
60
- --frp-faction-sanews: #06B6D4;
61
- --frp-faction-gov: #059669;
62
- --frp-faction-hitman: #DC2626;
63
- --frp-faction-medic: #F43F5E;
64
- --frp-faction-ng: #4B5563;
65
-
66
- /* ---- Gang Colors (from bandana hex) ---- */
67
- --frp-gang-ghouls: #F58216;
68
- --frp-gang-velvet: #636363;
69
- --frp-gang-baba: #22C55E;
70
- --frp-gang-rifa: #3B82F6;
71
- --frp-gang-grove: #16A34A;
72
- --frp-gang-lcn: #1F2937;
73
-
74
- /* ---- Typography ---- */
75
- --frp-font-display: 'Barlow Condensed', sans-serif;
76
- --frp-font-body: 'Barlow', sans-serif;
77
- --frp-font-mono: 'JetBrains Mono', monospace;
78
- --bs-body-font-family: 'Barlow', sans-serif;
10
+ /* ---- Backgrounds ---- */
11
+ --bs-body-bg: #0a0a0b;
12
+ --bs-body-color: #e5e7eb;
13
+ --bs-secondary-bg: #111114;
14
+ --bs-tertiary-bg: #18181c;
15
+
16
+ /* ---- Surfaces ---- */
17
+ --frp-surface: #111114;
18
+ --frp-surface-hover: #18181c;
19
+ --frp-surface-active: #1e1e24;
20
+ --frp-surface-elevated: #1a1a1f;
21
+
22
+ /* ---- Borders ---- */
23
+ --frp-border: #1e1e24;
24
+ --frp-border-subtle: #161619;
25
+ --frp-border-strong: #2a2a32;
26
+
27
+ /* ---- Primary — Gold/Amber (power, money, authority) ---- */
28
+ --frp-primary: #F59E0B;
29
+ --frp-primary-hover: #D97706;
30
+ --frp-primary-light: rgba(245, 158, 11, 0.15);
31
+ --frp-primary-glow: 0 0 20px rgba(245, 158, 11, 0.3);
32
+ --bs-primary: #F59E0B;
33
+ --bs-primary-rgb: 245, 158, 11;
34
+ --bs-link-color: #F59E0B;
35
+ --bs-link-hover-color: #D97706;
36
+
37
+ /* ---- Danger — Red ---- */
38
+ --frp-danger: #EF4444;
39
+ --frp-danger-light: rgba(239, 68, 68, 0.15);
40
+
41
+ /* ---- Success — Green ---- */
42
+ --frp-success: #22C55E;
43
+ --frp-success-light: rgba(34, 197, 94, 0.15);
44
+
45
+ /* ---- Info — Blue (law enforcement) ---- */
46
+ --frp-info: #3B82F6;
47
+ --frp-info-light: rgba(59, 130, 246, 0.15);
48
+
49
+ /* ---- Warning ---- */
50
+ --frp-warning: #F59E0B;
51
+ --frp-warning-light: rgba(245, 158, 11, 0.15);
52
+
53
+ /* ---- Muted ---- */
54
+ --frp-muted: #6B7280;
55
+ --frp-muted-light: #9CA3AF;
56
+
57
+ /* ---- Faction Colors ---- */
58
+ --frp-faction-lspd: #3B82F6;
59
+ --frp-faction-fbi: #1D4ED8;
60
+ --frp-faction-sasd: #92400E;
61
+ --frp-faction-ares: #7C3AED;
62
+ --frp-faction-sanews: #06B6D4;
63
+ --frp-faction-gov: #059669;
64
+ --frp-faction-hitman: #DC2626;
65
+ --frp-faction-medic: #F43F5E;
66
+ --frp-faction-ng: #4B5563;
67
+
68
+ /* ---- Gang Colors (from bandana hex) ---- */
69
+ --frp-gang-ghouls: #F58216;
70
+ --frp-gang-velvet: #636363;
71
+ --frp-gang-baba: #22C55E;
72
+ --frp-gang-rifa: #3B82F6;
73
+ --frp-gang-grove: #16A34A;
74
+ --frp-gang-lcn: #1F2937;
75
+
76
+ /* ---- Typography ---- */
77
+ --frp-font-display: 'Barlow Condensed', sans-serif;
78
+ --frp-font-body: 'Barlow', sans-serif;
79
+ --frp-font-mono: 'JetBrains Mono', monospace;
80
+ --bs-body-font-family: 'Barlow', sans-serif;
79
81
  }
80
82
 
81
83
  /* ============================================
82
- GLOBAL OVERRIDES
83
- ============================================ */
84
+ GLOBAL OVERRIDES
85
+ ============================================ */
84
86
 
85
87
  body {
86
- background-color: #0a0a0b !important;
87
- color: #e5e7eb;
88
- font-family: var(--frp-font-body);
89
- -webkit-font-smoothing: antialiased;
90
- -moz-osx-font-smoothing: grayscale;
88
+ background-color: #0a0a0b !important;
89
+ color: #e5e7eb;
90
+ font-family: var(--frp-font-body);
91
+ -webkit-font-smoothing: antialiased;
92
+ -moz-osx-font-smoothing: grayscale;
91
93
  }
92
94
 
93
95
  a {
94
- color: var(--frp-primary);
95
- text-decoration: none;
96
- transition: color 0.15s ease;
96
+ color: var(--frp-primary);
97
+ text-decoration: none;
98
+ transition: color 0.15s ease;
97
99
  }
98
100
 
99
101
  a:hover {
100
- color: var(--frp-primary-hover);
102
+ color: var(--frp-primary-hover);
101
103
  }
102
104
 
103
105
  h1, h2, h3, h4, h5, h6 {
104
- font-family: var(--frp-font-display);
105
- font-weight: 700;
106
- text-transform: uppercase;
107
- letter-spacing: 0.5px;
108
- color: #f3f4f6;
106
+ font-family: var(--frp-font-display);
107
+ font-weight: 700;
108
+ text-transform: uppercase;
109
+ letter-spacing: 0.5px;
110
+ color: #f3f4f6;
109
111
  }
110
112
 
111
113
  code, pre, .monospace {
112
- font-family: var(--frp-font-mono);
114
+ font-family: var(--frp-font-mono);
113
115
  }
114
116
 
115
117
  ::selection {
116
- background: rgba(245, 158, 11, 0.3);
117
- color: #fff;
118
+ background: rgba(245, 158, 11, 0.3);
119
+ color: #fff;
118
120
  }
119
121
 
120
122
  /* Scrollbar */
121
123
  ::-webkit-scrollbar {
122
- width: 8px;
123
- height: 8px;
124
+ width: 8px;
125
+ height: 8px;
124
126
  }
125
127
 
126
128
  ::-webkit-scrollbar-track {
127
- background: #0a0a0b;
129
+ background: #0a0a0b;
128
130
  }
129
131
 
130
132
  ::-webkit-scrollbar-thumb {
131
- background: #2a2a32;
132
- border-radius: 4px;
133
+ background: #2a2a32;
134
+ border-radius: 4px;
133
135
  }
134
136
 
135
137
  ::-webkit-scrollbar-thumb:hover {
136
- background: #3a3a44;
138
+ background: #3a3a44;
137
139
  }
138
140
 
139
141
  /* ============================================
140
- HEADER / NAVBAR
141
- ============================================ */
142
+ HEADER / NAVBAR
143
+ ============================================ */
142
144
 
143
145
  .navbar,
144
146
  [component="navbar"],
145
147
  header .navbar {
146
- background: #111114 !important;
147
- border-bottom: 1px solid var(--frp-border) !important;
148
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
149
- backdrop-filter: blur(12px);
148
+ background: #111114 !important;
149
+ border-bottom: 1px solid var(--frp-border) !important;
150
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
151
+ backdrop-filter: blur(12px);
150
152
  }
151
153
 
152
154
  .navbar .navbar-brand,
153
155
  [component="navbar"] .navbar-brand {
154
- font-family: var(--frp-font-display) !important;
155
- font-weight: 700 !important;
156
- color: var(--frp-primary) !important;
157
- text-transform: uppercase;
158
- letter-spacing: 2px;
159
- font-size: 1.3rem;
156
+ font-family: var(--frp-font-display) !important;
157
+ font-weight: 700 !important;
158
+ color: var(--frp-primary) !important;
159
+ text-transform: uppercase;
160
+ letter-spacing: 2px;
161
+ font-size: 1.3rem;
160
162
  }
161
163
 
162
164
  .navbar .nav-link,
163
165
  [component="navbar"] .nav-link {
164
- color: #9CA3AF !important;
165
- font-family: var(--frp-font-body);
166
- font-weight: 500;
167
- transition: color 0.15s ease;
166
+ color: #9CA3AF !important;
167
+ font-family: var(--frp-font-body);
168
+ font-weight: 500;
169
+ transition: color 0.15s ease;
168
170
  }
169
171
 
170
172
  .navbar .nav-link:hover,
171
173
  .navbar .nav-link.active,
172
174
  [component="navbar"] .nav-link:hover,
173
175
  [component="navbar"] .nav-link.active {
174
- color: var(--frp-primary) !important;
176
+ color: var(--frp-primary) !important;
175
177
  }
176
178
 
177
179
  .navbar .dropdown-menu,
178
180
  [component="navbar"] .dropdown-menu {
179
- background: var(--frp-surface) !important;
180
- border: 1px solid var(--frp-border) !important;
181
- box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
181
+ background: var(--frp-surface) !important;
182
+ border: 1px solid var(--frp-border) !important;
183
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
182
184
  }
183
185
 
184
186
  .navbar .dropdown-item,
185
187
  [component="navbar"] .dropdown-item {
186
- color: #e5e7eb !important;
188
+ color: #e5e7eb !important;
187
189
  }
188
190
 
189
191
  .navbar .dropdown-item:hover,
190
192
  [component="navbar"] .dropdown-item:hover {
191
- background: var(--frp-surface-hover) !important;
192
- color: var(--frp-primary) !important;
193
+ background: var(--frp-surface-hover) !important;
194
+ color: var(--frp-primary) !important;
193
195
  }
194
196
 
195
197
  /* ============================================
196
- CATEGORY LIST
197
- ============================================ */
198
+ CATEGORY LIST
199
+ ============================================ */
198
200
 
199
201
  [component="categories/category"] {
200
- background: var(--frp-surface) !important;
201
- border: 1px solid var(--frp-border) !important;
202
- border-left: 3px solid var(--frp-primary) !important;
203
- border-radius: 4px !important;
204
- margin-bottom: 8px !important;
205
- transition: all 0.2s ease;
202
+ background: var(--frp-surface) !important;
203
+ border: 1px solid var(--frp-border) !important;
204
+ border-left: 3px solid var(--frp-primary) !important;
205
+ border-radius: 4px !important;
206
+ margin-bottom: 8px !important;
207
+ transition: all 0.2s ease;
206
208
  }
207
209
 
208
210
  [component="categories/category"]:hover {
209
- border-left-color: var(--frp-primary-hover) !important;
210
- background: var(--frp-surface-hover) !important;
211
- box-shadow: var(--frp-primary-glow);
211
+ border-left-color: var(--frp-primary-hover) !important;
212
+ background: var(--frp-surface-hover) !important;
213
+ box-shadow: var(--frp-primary-glow);
212
214
  }
213
215
 
214
216
  /* Category Headers / Section Headers */
215
217
  .category-header,
216
218
  .section-header {
217
- font-family: var(--frp-font-display);
218
- font-weight: 700;
219
- text-transform: uppercase;
220
- letter-spacing: 2px;
221
- color: var(--frp-primary);
222
- border-bottom: 2px solid var(--frp-primary);
223
- padding-bottom: 8px;
224
- margin-bottom: 16px;
225
- font-size: 1.1rem;
219
+ font-family: var(--frp-font-display);
220
+ font-weight: 700;
221
+ text-transform: uppercase;
222
+ letter-spacing: 2px;
223
+ color: var(--frp-primary);
224
+ border-bottom: 2px solid var(--frp-primary);
225
+ padding-bottom: 8px;
226
+ margin-bottom: 16px;
227
+ font-size: 1.1rem;
226
228
  }
227
229
 
228
230
  /* Category icons */
229
231
  [component="categories/category"] .category-icon {
230
- color: var(--frp-primary);
232
+ color: var(--frp-primary);
231
233
  }
232
234
 
233
235
  /* Category stats */
234
236
  [component="categories/category"] .category-stat {
235
- color: var(--frp-muted);
236
- font-family: var(--frp-font-mono);
237
- font-size: 0.8rem;
237
+ color: var(--frp-muted);
238
+ font-family: var(--frp-font-mono);
239
+ font-size: 0.8rem;
238
240
  }
239
241
 
240
242
  /* Category description */
241
243
  [component="categories/category"] .category-description {
242
- color: var(--frp-muted-light);
243
- font-size: 0.85rem;
244
+ color: var(--frp-muted-light);
245
+ font-size: 0.85rem;
244
246
  }
245
247
 
246
248
  /* ============================================
247
- TOPIC LIST
248
- ============================================ */
249
+ TOPIC LIST
250
+ ============================================ */
249
251
 
250
- component="category/topic",
252
+ [component="category/topic"],
251
253
  [component="category"] .topic-row,
252
254
  .topics-list .topic-row {
253
- background: var(--frp-surface) !important;
254
- border: 1px solid var(--frp-border) !important;
255
- border-radius: 4px !important;
256
- margin-bottom: 4px !important;
257
- transition: all 0.15s ease;
255
+ background: var(--frp-surface) !important;
256
+ border: 1px solid var(--frp-border) !important;
257
+ border-radius: 4px !important;
258
+ margin-bottom: 4px !important;
259
+ transition: all 0.15s ease;
258
260
  }
259
261
 
262
+ [component="category/topic"]:hover,
260
263
  .topics-list .topic-row:hover {
261
- background: var(--frp-surface-hover) !important;
262
- border-color: var(--frp-border-strong) !important;
264
+ background: var(--frp-surface-hover) !important;
265
+ border-color: var(--frp-border-strong) !important;
263
266
  }
264
267
 
265
- component="category/topic" .title,
268
+ [component="category/topic"] .title,
266
269
  .topics-list .topic-title a {
267
- color: #e5e7eb !important;
268
- font-weight: 500;
270
+ color: #e5e7eb !important;
271
+ font-weight: 500;
269
272
  }
270
273
 
271
- component="category/topic" .title:hover,
274
+ [component="category/topic"] .title:hover,
272
275
  .topics-list .topic-title a:hover {
273
- color: var(--frp-primary) !important;
276
+ color: var(--frp-primary) !important;
274
277
  }
275
278
 
276
279
  /* Pinned topics */
277
- component="category/topic".pinned {
278
- border-left: 3px solid var(--frp-primary) !important;
280
+ [component="category/topic"].pinned {
281
+ border-left: 3px solid var(--frp-primary) !important;
279
282
  }
280
283
 
281
284
  /* Locked topics */
282
- component="category/topic".locked {
283
- opacity: 0.7;
285
+ [component="category/topic"].locked {
286
+ opacity: 0.7;
284
287
  }
285
288
 
286
289
  /* ============================================
287
- TOPIC VIEW / POST CONTENT
288
- ============================================ */
290
+ TOPIC VIEW / POST CONTENT
291
+ ============================================ */
289
292
 
290
293
  [component="post"],
291
294
  .post-container {
292
- background: var(--frp-surface) !important;
293
- border: 1px solid var(--frp-border) !important;
294
- border-radius: 4px !important;
295
- margin-bottom: 12px !important;
295
+ background: var(--frp-surface) !important;
296
+ border: 1px solid var(--frp-border) !important;
297
+ border-radius: 4px !important;
298
+ margin-bottom: 12px !important;
296
299
  }
297
300
 
298
301
  [component="post"] .post-header {
299
- border-bottom: 1px solid var(--frp-border);
300
- padding-bottom: 8px;
302
+ border-bottom: 1px solid var(--frp-border);
303
+ padding-bottom: 8px;
301
304
  }
302
305
 
303
306
  [component="post"] .content,
304
307
  .post-content {
305
- color: #d1d5db;
306
- line-height: 1.7;
308
+ color: #d1d5db;
309
+ line-height: 1.7;
307
310
  }
308
311
 
309
312
  [component="post"] .content blockquote {
310
- border-left: 3px solid var(--frp-primary);
311
- background: var(--frp-primary-light);
312
- padding: 12px 16px;
313
- border-radius: 0 4px 4px 0;
314
- color: #e5e7eb;
313
+ border-left: 3px solid var(--frp-primary);
314
+ background: var(--frp-primary-light);
315
+ padding: 12px 16px;
316
+ border-radius: 0 4px 4px 0;
317
+ color: #e5e7eb;
315
318
  }
316
319
 
317
320
  [component="post"] .content code {
318
- background: rgba(245, 158, 11, 0.1);
319
- color: var(--frp-primary);
320
- padding: 2px 6px;
321
- border-radius: 3px;
322
- font-family: var(--frp-font-mono);
321
+ background: rgba(245, 158, 11, 0.1);
322
+ color: var(--frp-primary);
323
+ padding: 2px 6px;
324
+ border-radius: 3px;
325
+ font-family: var(--frp-font-mono);
323
326
  }
324
327
 
325
328
  [component="post"] .content pre {
326
- background: #0d0d0f !important;
327
- border: 1px solid var(--frp-border);
328
- border-radius: 4px;
329
- padding: 16px;
329
+ background: #0d0d0f !important;
330
+ border: 1px solid var(--frp-border);
331
+ border-radius: 4px;
332
+ padding: 16px;
330
333
  }
331
334
 
332
335
  /* Post actions */
333
336
  [component="post"] .post-footer .btn,
334
337
  [component="post"] .actions .btn {
335
- color: var(--frp-muted) !important;
336
- transition: color 0.15s ease;
338
+ color: var(--frp-muted) !important;
339
+ transition: color 0.15s ease;
337
340
  }
338
341
 
339
342
  [component="post"] .post-footer .btn:hover,
340
343
  [component="post"] .actions .btn:hover {
341
- color: var(--frp-primary) !important;
344
+ color: var(--frp-primary) !important;
342
345
  }
343
346
 
344
347
  /* ============================================
345
- USER PROFILE / AVATAR
346
- ============================================ */
348
+ USER PROFILE / AVATAR
349
+ ============================================ */
347
350
 
348
351
  .avatar {
349
- border: 2px solid var(--frp-border);
350
- border-radius: 50%;
352
+ border: 2px solid var(--frp-border);
353
+ border-radius: 50%;
351
354
  }
352
355
 
353
356
  /* Donator glow effects */
354
357
  .avatar.donator-daisy {
355
- border-color: #A3E635;
356
- box-shadow: 0 0 8px rgba(163, 230, 53, 0.3);
358
+ border-color: #A3E635;
359
+ box-shadow: 0 0 8px rgba(163, 230, 53, 0.3);
357
360
  }
358
361
 
359
362
  .avatar.donator-rose {
360
- border-color: #F59E0B;
361
- box-shadow: 0 0 8px rgba(245, 158, 11, 0.3);
363
+ border-color: #F59E0B;
364
+ box-shadow: 0 0 8px rgba(245, 158, 11, 0.3);
362
365
  }
363
366
 
364
367
  .avatar.donator-ivy {
365
- border-color: #EF4444;
366
- box-shadow: 0 0 12px rgba(239, 68, 68, 0.4);
367
- animation: ivyGlow 2s ease-in-out infinite alternate;
368
+ border-color: #EF4444;
369
+ box-shadow: 0 0 12px rgba(239, 68, 68, 0.4);
370
+ animation: ivyGlow 2s ease-in-out infinite alternate;
368
371
  }
369
372
 
370
373
  @keyframes ivyGlow {
371
- from { box-shadow: 0 0 8px rgba(239, 68, 68, 0.3); }
372
- to { box-shadow: 0 0 16px rgba(245, 158, 11, 0.5); }
374
+ from { box-shadow: 0 0 8px rgba(239, 68, 68, 0.3); }
375
+ to { box-shadow: 0 0 16px rgba(245, 158, 11, 0.5); }
373
376
  }
374
377
 
375
378
  /* User profile page */
376
379
  [component="account/profile"] {
377
- background: var(--frp-surface) !important;
380
+ background: var(--frp-surface) !important;
378
381
  }
379
382
 
380
383
  .profile-header {
381
- background: linear-gradient(135deg, #111114 0%, #1a1a1f 100%);
382
- border-bottom: 2px solid var(--frp-primary);
384
+ background: linear-gradient(135deg, #111114 0%, #1a1a1f 100%);
385
+ border-bottom: 2px solid var(--frp-primary);
383
386
  }
384
387
 
385
388
  /* ============================================
386
- SIDEBAR & WIDGETS
387
- ============================================ */
389
+ SIDEBAR & WIDGETS
390
+ ============================================ */
388
391
 
389
392
  .sidebar .widget,
390
393
  [widget-area] .widget {
391
- background: var(--frp-surface) !important;
392
- border: 1px solid var(--frp-border) !important;
393
- border-radius: 4px !important;
394
- margin-bottom: 12px !important;
394
+ background: var(--frp-surface) !important;
395
+ border: 1px solid var(--frp-border) !important;
396
+ border-radius: 4px !important;
397
+ margin-bottom: 12px !important;
395
398
  }
396
399
 
397
400
  .sidebar .widget .widget-header,
398
401
  [widget-area] .widget .widget-header {
399
- font-family: var(--frp-font-display);
400
- font-weight: 700;
401
- text-transform: uppercase;
402
- letter-spacing: 1px;
403
- color: var(--frp-primary);
404
- border-bottom: 2px solid var(--frp-primary);
405
- padding-bottom: 8px;
406
- margin-bottom: 12px;
407
- font-size: 0.95rem;
402
+ font-family: var(--frp-font-display);
403
+ font-weight: 700;
404
+ text-transform: uppercase;
405
+ letter-spacing: 1px;
406
+ color: var(--frp-primary);
407
+ border-bottom: 2px solid var(--frp-primary);
408
+ padding-bottom: 8px;
409
+ margin-bottom: 12px;
410
+ font-size: 0.95rem;
408
411
  }
409
412
 
410
413
  /* ============================================
411
- BUTTONS
412
- ============================================ */
414
+ BUTTONS
415
+ ============================================ */
413
416
 
414
417
  .btn-primary,
415
418
  .btn-primary:focus {
416
- background-color: var(--frp-primary) !important;
417
- border-color: var(--frp-primary) !important;
418
- color: #000 !important;
419
- font-family: var(--frp-font-display);
420
- font-weight: 600;
421
- text-transform: uppercase;
422
- letter-spacing: 1px;
423
- transition: all 0.2s ease;
419
+ background-color: var(--frp-primary) !important;
420
+ border-color: var(--frp-primary) !important;
421
+ color: #000 !important;
422
+ font-family: var(--frp-font-display);
423
+ font-weight: 600;
424
+ text-transform: uppercase;
425
+ letter-spacing: 1px;
426
+ transition: all 0.2s ease;
424
427
  }
425
428
 
426
429
  .btn-primary:hover {
427
- background-color: var(--frp-primary-hover) !important;
428
- border-color: var(--frp-primary-hover) !important;
429
- box-shadow: var(--frp-primary-glow);
430
+ background-color: var(--frp-primary-hover) !important;
431
+ border-color: var(--frp-primary-hover) !important;
432
+ box-shadow: var(--frp-primary-glow);
430
433
  }
431
434
 
432
435
  .btn-outline-primary {
433
- border-color: var(--frp-primary) !important;
434
- color: var(--frp-primary) !important;
436
+ border-color: var(--frp-primary) !important;
437
+ color: var(--frp-primary) !important;
435
438
  }
436
439
 
437
440
  .btn-outline-primary:hover {
438
- background-color: var(--frp-primary) !important;
439
- color: #000 !important;
441
+ background-color: var(--frp-primary) !important;
442
+ color: #000 !important;
440
443
  }
441
444
 
442
445
  .btn-secondary {
443
- background-color: var(--frp-surface-active) !important;
444
- border-color: var(--frp-border) !important;
445
- color: #e5e7eb !important;
446
+ background-color: var(--frp-surface-active) !important;
447
+ border-color: var(--frp-border) !important;
448
+ color: #e5e7eb !important;
446
449
  }
447
450
 
448
451
  .btn-secondary:hover {
449
- background-color: var(--frp-surface-hover) !important;
450
- border-color: var(--frp-border-strong) !important;
452
+ background-color: var(--frp-surface-hover) !important;
453
+ border-color: var(--frp-border-strong) !important;
451
454
  }
452
455
 
453
456
  .btn-danger {
454
- background-color: var(--frp-danger) !important;
455
- border-color: var(--frp-danger) !important;
457
+ background-color: var(--frp-danger) !important;
458
+ border-color: var(--frp-danger) !important;
456
459
  }
457
460
 
458
461
  .btn-success {
459
- background-color: var(--frp-success) !important;
460
- border-color: var(--frp-success) !important;
462
+ background-color: var(--frp-success) !important;
463
+ border-color: var(--frp-success) !important;
461
464
  }
462
465
 
463
466
  /* ============================================
464
- FORMS & INPUTS
465
- ============================================ */
467
+ FORMS & INPUTS
468
+ ============================================ */
466
469
 
467
470
  .form-control,
468
471
  .form-select,
@@ -471,12 +474,12 @@ input[type="email"],
471
474
  input[type="password"],
472
475
  textarea,
473
476
  select {
474
- background-color: #0d0d0f !important;
475
- border: 1px solid var(--frp-border) !important;
476
- color: #e5e7eb !important;
477
- font-family: var(--frp-font-body);
478
- border-radius: 4px;
479
- transition: border-color 0.15s ease;
477
+ background-color: #0d0d0f !important;
478
+ border: 1px solid var(--frp-border) !important;
479
+ color: #e5e7eb !important;
480
+ font-family: var(--frp-font-body);
481
+ border-radius: 4px;
482
+ transition: border-color 0.15s ease;
480
483
  }
481
484
 
482
485
  .form-control:focus,
@@ -484,145 +487,145 @@ transition: border-color 0.15s ease;
484
487
  input:focus,
485
488
  textarea:focus,
486
489
  select:focus {
487
- border-color: var(--frp-primary) !important;
488
- box-shadow: 0 0 0 3px var(--frp-primary-light) !important;
489
- outline: none;
490
+ border-color: var(--frp-primary) !important;
491
+ box-shadow: 0 0 0 3px var(--frp-primary-light) !important;
492
+ outline: none;
490
493
  }
491
494
 
492
495
  .form-control::placeholder {
493
- color: var(--frp-muted) !important;
496
+ color: var(--frp-muted) !important;
494
497
  }
495
498
 
496
499
  /* ============================================
497
- CARDS & PANELS
498
- ============================================ */
500
+ CARDS & PANELS
501
+ ============================================ */
499
502
 
500
503
  .card {
501
- background: var(--frp-surface) !important;
502
- border: 1px solid var(--frp-border) !important;
503
- border-radius: 4px !important;
504
+ background: var(--frp-surface) !important;
505
+ border: 1px solid var(--frp-border) !important;
506
+ border-radius: 4px !important;
504
507
  }
505
508
 
506
509
  .card-header {
507
- background: var(--frp-surface-hover) !important;
508
- border-bottom: 1px solid var(--frp-border) !important;
509
- font-family: var(--frp-font-display);
510
- font-weight: 600;
511
- text-transform: uppercase;
512
- letter-spacing: 1px;
510
+ background: var(--frp-surface-hover) !important;
511
+ border-bottom: 1px solid var(--frp-border) !important;
512
+ font-family: var(--frp-font-display);
513
+ font-weight: 600;
514
+ text-transform: uppercase;
515
+ letter-spacing: 1px;
513
516
  }
514
517
 
515
518
  .card-footer {
516
- background: var(--frp-surface-hover) !important;
517
- border-top: 1px solid var(--frp-border) !important;
519
+ background: var(--frp-surface-hover) !important;
520
+ border-top: 1px solid var(--frp-border) !important;
518
521
  }
519
522
 
520
523
  /* ============================================
521
- MODALS
522
- ============================================ */
524
+ MODALS
525
+ ============================================ */
523
526
 
524
527
  .modal-content {
525
- background: var(--frp-surface) !important;
526
- border: 1px solid var(--frp-border) !important;
528
+ background: var(--frp-surface) !important;
529
+ border: 1px solid var(--frp-border) !important;
527
530
  }
528
531
 
529
532
  .modal-header {
530
- border-bottom: 1px solid var(--frp-border) !important;
533
+ border-bottom: 1px solid var(--frp-border) !important;
531
534
  }
532
535
 
533
536
  .modal-footer {
534
- border-top: 1px solid var(--frp-border) !important;
537
+ border-top: 1px solid var(--frp-border) !important;
535
538
  }
536
539
 
537
540
  /* ============================================
538
- PAGINATION
539
- ============================================ */
541
+ PAGINATION
542
+ ============================================ */
540
543
 
541
544
  .pagination .page-link {
542
- background: var(--frp-surface) !important;
543
- border-color: var(--frp-border) !important;
544
- color: #e5e7eb !important;
545
+ background: var(--frp-surface) !important;
546
+ border-color: var(--frp-border) !important;
547
+ color: #e5e7eb !important;
545
548
  }
546
549
 
547
550
  .pagination .page-link:hover {
548
- background: var(--frp-surface-hover) !important;
549
- color: var(--frp-primary) !important;
551
+ background: var(--frp-surface-hover) !important;
552
+ color: var(--frp-primary) !important;
550
553
  }
551
554
 
552
555
  .pagination .page-item.active .page-link {
553
- background: var(--frp-primary) !important;
554
- border-color: var(--frp-primary) !important;
555
- color: #000 !important;
556
+ background: var(--frp-primary) !important;
557
+ border-color: var(--frp-primary) !important;
558
+ color: #000 !important;
556
559
  }
557
560
 
558
561
  /* ============================================
559
- BREADCRUMBS
560
- ============================================ */
562
+ BREADCRUMBS
563
+ ============================================ */
561
564
 
562
565
  .breadcrumb {
563
- background: transparent !important;
564
- padding: 8px 0;
566
+ background: transparent !important;
567
+ padding: 8px 0;
565
568
  }
566
569
 
567
570
  .breadcrumb-item a {
568
- color: var(--frp-muted-light) !important;
571
+ color: var(--frp-muted-light) !important;
569
572
  }
570
573
 
571
574
  .breadcrumb-item a:hover {
572
- color: var(--frp-primary) !important;
575
+ color: var(--frp-primary) !important;
573
576
  }
574
577
 
575
578
  .breadcrumb-item.active {
576
- color: var(--frp-primary) !important;
579
+ color: var(--frp-primary) !important;
577
580
  }
578
581
 
579
582
  .breadcrumb-item + .breadcrumb-item::before {
580
- color: var(--frp-muted) !important;
583
+ color: var(--frp-muted) !important;
581
584
  }
582
585
 
583
586
  /* ============================================
584
- ALERTS & NOTIFICATIONS
585
- ============================================ */
587
+ ALERTS & NOTIFICATIONS
588
+ ============================================ */
586
589
 
587
590
  .alert-success {
588
- background: var(--frp-success-light) !important;
589
- border-color: var(--frp-success) !important;
590
- color: var(--frp-success) !important;
591
+ background: var(--frp-success-light) !important;
592
+ border-color: var(--frp-success) !important;
593
+ color: var(--frp-success) !important;
591
594
  }
592
595
 
593
596
  .alert-danger {
594
- background: var(--frp-danger-light) !important;
595
- border-color: var(--frp-danger) !important;
596
- color: var(--frp-danger) !important;
597
+ background: var(--frp-danger-light) !important;
598
+ border-color: var(--frp-danger) !important;
599
+ color: var(--frp-danger) !important;
597
600
  }
598
601
 
599
602
  .alert-warning {
600
- background: var(--frp-warning-light) !important;
601
- border-color: var(--frp-warning) !important;
602
- color: var(--frp-warning) !important;
603
+ background: var(--frp-warning-light) !important;
604
+ border-color: var(--frp-warning) !important;
605
+ color: var(--frp-warning) !important;
603
606
  }
604
607
 
605
608
  .alert-info {
606
- background: var(--frp-info-light) !important;
607
- border-color: var(--frp-info) !important;
608
- color: var(--frp-info) !important;
609
+ background: var(--frp-info-light) !important;
610
+ border-color: var(--frp-info) !important;
611
+ color: var(--frp-info) !important;
609
612
  }
610
613
 
611
614
  /* ============================================
612
- BADGES & LABELS
613
- ============================================ */
615
+ BADGES & LABELS
616
+ ============================================ */
614
617
 
615
618
  .badge {
616
- font-family: var(--frp-font-display);
617
- font-weight: 600;
618
- text-transform: uppercase;
619
- letter-spacing: 0.5px;
619
+ font-family: var(--frp-font-display);
620
+ font-weight: 600;
621
+ text-transform: uppercase;
622
+ letter-spacing: 0.5px;
620
623
  }
621
624
 
622
625
  .badge.badge-primary,
623
626
  .badge.bg-primary {
624
- background: var(--frp-primary) !important;
625
- color: #000 !important;
627
+ background: var(--frp-primary) !important;
628
+ color: #000 !important;
626
629
  }
627
630
 
628
631
  /* Faction badges */
@@ -646,361 +649,361 @@ color: #000 !important;
646
649
 
647
650
  /* VIP badges */
648
651
  .badge-vip-daisy {
649
- background: linear-gradient(135deg, #A3E635, #65A30D) !important;
650
- color: #000 !important;
652
+ background: linear-gradient(135deg, #A3E635, #65A30D) !important;
653
+ color: #000 !important;
651
654
  }
652
655
 
653
656
  .badge-vip-rose {
654
- background: linear-gradient(135deg, #F59E0B, #D97706) !important;
655
- color: #000 !important;
657
+ background: linear-gradient(135deg, #F59E0B, #D97706) !important;
658
+ color: #000 !important;
656
659
  }
657
660
 
658
661
  .badge-vip-ivy {
659
- background: linear-gradient(135deg, #EF4444, #DC2626) !important;
660
- color: #fff !important;
661
- animation: ivyBadgeGlow 2s ease-in-out infinite alternate;
662
+ background: linear-gradient(135deg, #EF4444, #DC2626) !important;
663
+ color: #fff !important;
664
+ animation: ivyBadgeGlow 2s ease-in-out infinite alternate;
662
665
  }
663
666
 
664
667
  @keyframes ivyBadgeGlow {
665
- from { box-shadow: 0 0 4px rgba(239, 68, 68, 0.3); }
666
- to { box-shadow: 0 0 12px rgba(245, 158, 11, 0.5); }
668
+ from { box-shadow: 0 0 4px rgba(239, 68, 68, 0.3); }
669
+ to { box-shadow: 0 0 12px rgba(245, 158, 11, 0.5); }
667
670
  }
668
671
 
669
672
  /* ============================================
670
- TABLES
671
- ============================================ */
673
+ TABLES
674
+ ============================================ */
672
675
 
673
676
  .table,
674
677
  table {
675
- --bs-table-bg: var(--frp-surface);
676
- --bs-table-border-color: var(--frp-border);
677
- color: #e5e7eb;
678
+ --bs-table-bg: var(--frp-surface);
679
+ --bs-table-border-color: var(--frp-border);
680
+ color: #e5e7eb;
678
681
  }
679
682
 
680
683
  .table thead th {
681
- background: var(--frp-surface-hover) !important;
682
- border-bottom: 2px solid var(--frp-primary) !important;
683
- font-family: var(--frp-font-display);
684
- font-weight: 600;
685
- text-transform: uppercase;
686
- letter-spacing: 0.5px;
687
- color: var(--frp-primary);
688
- font-size: 0.85rem;
684
+ background: var(--frp-surface-hover) !important;
685
+ border-bottom: 2px solid var(--frp-primary) !important;
686
+ font-family: var(--frp-font-display);
687
+ font-weight: 600;
688
+ text-transform: uppercase;
689
+ letter-spacing: 0.5px;
690
+ color: var(--frp-primary);
691
+ font-size: 0.85rem;
689
692
  }
690
693
 
691
694
  .table tbody tr {
692
- border-bottom: 1px solid var(--frp-border);
695
+ border-bottom: 1px solid var(--frp-border);
693
696
  }
694
697
 
695
698
  .table tbody tr:hover {
696
- background: var(--frp-surface-hover) !important;
699
+ background: var(--frp-surface-hover) !important;
697
700
  }
698
701
 
699
702
  .table-striped tbody tr:nth-of-type(odd) {
700
- background: rgba(17, 17, 20, 0.5) !important;
703
+ background: rgba(17, 17, 20, 0.5) !important;
701
704
  }
702
705
 
703
706
  /* ============================================
704
- FOOTER
705
- ============================================ */
707
+ FOOTER
708
+ ============================================ */
706
709
 
707
710
  footer,
708
711
  [component="footer"] {
709
- background: #0a0a0b !important;
710
- border-top: 1px solid var(--frp-border) !important;
711
- color: var(--frp-muted);
712
+ background: #0a0a0b !important;
713
+ border-top: 1px solid var(--frp-border) !important;
714
+ color: var(--frp-muted);
712
715
  }
713
716
 
714
717
  footer a {
715
- color: var(--frp-muted-light) !important;
718
+ color: var(--frp-muted-light) !important;
716
719
  }
717
720
 
718
721
  footer a:hover {
719
- color: var(--frp-primary) !important;
722
+ color: var(--frp-primary) !important;
720
723
  }
721
724
 
722
725
  /* ============================================
723
- COMPOSER (Post Editor)
724
- ============================================ */
726
+ COMPOSER (Post Editor)
727
+ ============================================ */
725
728
 
726
729
  .composer {
727
- background: var(--frp-surface) !important;
728
- border: 1px solid var(--frp-border) !important;
730
+ background: var(--frp-surface) !important;
731
+ border: 1px solid var(--frp-border) !important;
729
732
  }
730
733
 
731
734
  .composer .title-container input {
732
- background: #0d0d0f !important;
733
- border: 1px solid var(--frp-border) !important;
734
- color: #e5e7eb !important;
735
+ background: #0d0d0f !important;
736
+ border: 1px solid var(--frp-border) !important;
737
+ color: #e5e7eb !important;
735
738
  }
736
739
 
737
740
  .composer .write-container textarea,
738
741
  .composer .preview-container {
739
- background: #0d0d0f !important;
740
- color: #e5e7eb !important;
742
+ background: #0d0d0f !important;
743
+ color: #e5e7eb !important;
741
744
  }
742
745
 
743
746
  .composer .formatting-bar {
744
- background: var(--frp-surface-hover) !important;
745
- border-bottom: 1px solid var(--frp-border) !important;
747
+ background: var(--frp-surface-hover) !important;
748
+ border-bottom: 1px solid var(--frp-border) !important;
746
749
  }
747
750
 
748
751
  .composer .formatting-bar .btn {
749
- color: var(--frp-muted-light) !important;
752
+ color: var(--frp-muted-light) !important;
750
753
  }
751
754
 
752
755
  .composer .formatting-bar .btn:hover {
753
- color: var(--frp-primary) !important;
756
+ color: var(--frp-primary) !important;
754
757
  }
755
758
 
756
759
  /* ============================================
757
- CHAT
758
- ============================================ */
760
+ CHAT
761
+ ============================================ */
759
762
 
760
763
  [component="chat"] {
761
- background: var(--frp-surface) !important;
764
+ background: var(--frp-surface) !important;
762
765
  }
763
766
 
764
767
  [component="chat/message"] {
765
- border-bottom: 1px solid var(--frp-border);
768
+ border-bottom: 1px solid var(--frp-border);
766
769
  }
767
770
 
768
771
  /* ============================================
769
- SEARCH
770
- ============================================ */
772
+ SEARCH
773
+ ============================================ */
771
774
 
772
775
  .search-results .search-result {
773
- background: var(--frp-surface) !important;
774
- border: 1px solid var(--frp-border) !important;
775
- border-radius: 4px;
776
- margin-bottom: 8px;
776
+ background: var(--frp-surface) !important;
777
+ border: 1px solid var(--frp-border) !important;
778
+ border-radius: 4px;
779
+ margin-bottom: 8px;
777
780
  }
778
781
 
779
782
  .search-results .search-result:hover {
780
- border-color: var(--frp-primary) !important;
783
+ border-color: var(--frp-primary) !important;
781
784
  }
782
785
 
783
786
  /* ============================================
784
- ADMIN CONTROL PANEL (ACP) — Minimal overrides
785
- ============================================ */
787
+ ADMIN CONTROL PANEL (ACP) — Minimal overrides
788
+ ============================================ */
786
789
 
787
790
  .acp-page {
788
- background: #0a0a0b;
791
+ background: #0a0a0b;
789
792
  }
790
793
 
791
794
  /* ============================================
792
- LOADING / SPINNER
793
- ============================================ */
795
+ LOADING / SPINNER
796
+ ============================================ */
794
797
 
795
798
  .loading-indicator {
796
- border-color: var(--frp-primary) transparent transparent transparent !important;
799
+ border-color: var(--frp-primary) transparent transparent transparent !important;
797
800
  }
798
801
 
799
802
  /* ============================================
800
- TOOLTIPS & POPOVERS
801
- ============================================ */
803
+ TOOLTIPS & POPOVERS
804
+ ============================================ */
802
805
 
803
806
  .tooltip-inner {
804
- background: var(--frp-surface-elevated) !important;
805
- border: 1px solid var(--frp-border);
806
- color: #e5e7eb;
807
+ background: var(--frp-surface-elevated) !important;
808
+ border: 1px solid var(--frp-border);
809
+ color: #e5e7eb;
807
810
  }
808
811
 
809
812
  .popover {
810
- background: var(--frp-surface) !important;
811
- border: 1px solid var(--frp-border) !important;
813
+ background: var(--frp-surface) !important;
814
+ border: 1px solid var(--frp-border) !important;
812
815
  }
813
816
 
814
817
  /* ============================================
815
- CUSTOM: SERVER STATUS WIDGET
816
- ============================================ */
818
+ CUSTOM: SERVER STATUS WIDGET
819
+ ============================================ */
817
820
 
818
821
  .frp-server-status {
819
- background: var(--frp-surface) !important;
820
- border: 1px solid var(--frp-border) !important;
821
- border-radius: 4px;
822
+ background: var(--frp-surface) !important;
823
+ border: 1px solid var(--frp-border) !important;
824
+ border-radius: 4px;
822
825
  }
823
826
 
824
827
  .frp-server-status .status-online {
825
- color: var(--frp-success);
828
+ color: var(--frp-success);
826
829
  }
827
830
 
828
831
  .frp-server-status .status-offline {
829
- color: var(--frp-danger);
832
+ color: var(--frp-danger);
830
833
  }
831
834
 
832
835
  @keyframes pulse {
833
- 0%, 100% { opacity: 1; }
834
- 50% { opacity: 0.5; }
836
+ 0%, 100% { opacity: 1; }
837
+ 50% { opacity: 0.5; }
835
838
  }
836
839
 
837
840
  /* ============================================
838
- CUSTOM: GAME STATS PROFILE CARD
839
- ============================================ */
841
+ CUSTOM: GAME STATS PROFILE CARD
842
+ ============================================ */
840
843
 
841
844
  .frp-game-stats {
842
- background: var(--frp-surface) !important;
843
- border: 1px solid var(--frp-border) !important;
844
- border-radius: 4px;
845
+ background: var(--frp-surface) !important;
846
+ border: 1px solid var(--frp-border) !important;
847
+ border-radius: 4px;
845
848
  }
846
849
 
847
850
  .frp-game-stats .card-header {
848
- font-family: var(--frp-font-display);
849
- color: var(--frp-primary);
850
- text-transform: uppercase;
851
- letter-spacing: 1px;
851
+ font-family: var(--frp-font-display);
852
+ color: var(--frp-primary);
853
+ text-transform: uppercase;
854
+ letter-spacing: 1px;
852
855
  }
853
856
 
854
857
  .frp-game-stats .stat-item {
855
- padding: 8px 0;
856
- border-bottom: 1px solid var(--frp-border);
858
+ padding: 8px 0;
859
+ border-bottom: 1px solid var(--frp-border);
857
860
  }
858
861
 
859
862
  .frp-game-stats .stat-item:last-child {
860
- border-bottom: none;
863
+ border-bottom: none;
861
864
  }
862
865
 
863
866
  .frp-game-stats .stat-label {
864
- color: var(--frp-muted);
865
- font-size: 0.8rem;
866
- text-transform: uppercase;
867
- letter-spacing: 0.5px;
868
- display: block;
867
+ color: var(--frp-muted);
868
+ font-size: 0.8rem;
869
+ text-transform: uppercase;
870
+ letter-spacing: 0.5px;
871
+ display: block;
869
872
  }
870
873
 
871
874
  .frp-game-stats .stat-value {
872
- color: #e5e7eb;
873
- font-family: var(--frp-font-mono);
874
- font-size: 1rem;
875
- font-weight: 500;
875
+ color: #e5e7eb;
876
+ font-family: var(--frp-font-mono);
877
+ font-size: 1rem;
878
+ font-weight: 500;
876
879
  }
877
880
 
878
881
  /* ============================================
879
- CUSTOM: DONATION STORE
880
- ============================================ */
882
+ CUSTOM: DONATION STORE
883
+ ============================================ */
881
884
 
882
885
  .frp-store-item {
883
- background: var(--frp-surface);
884
- border: 1px solid var(--frp-border);
885
- border-radius: 4px;
886
- padding: 20px;
887
- transition: all 0.2s ease;
888
- position: relative;
889
- overflow: hidden;
886
+ background: var(--frp-surface);
887
+ border: 1px solid var(--frp-border);
888
+ border-radius: 4px;
889
+ padding: 20px;
890
+ transition: all 0.2s ease;
891
+ position: relative;
892
+ overflow: hidden;
890
893
  }
891
894
 
892
895
  .frp-store-item:hover {
893
- border-color: var(--frp-primary);
894
- box-shadow: var(--frp-primary-glow);
895
- transform: translateY(-2px);
896
+ border-color: var(--frp-primary);
897
+ box-shadow: var(--frp-primary-glow);
898
+ transform: translateY(-2px);
896
899
  }
897
900
 
898
901
  .frp-store-item.tier-daisy {
899
- border-top: 3px solid #A3E635;
902
+ border-top: 3px solid #A3E635;
900
903
  }
901
904
 
902
905
  .frp-store-item.tier-rose {
903
- border-top: 3px solid #F59E0B;
906
+ border-top: 3px solid #F59E0B;
904
907
  }
905
908
 
906
909
  .frp-store-item.tier-ivy {
907
- border-top: 3px solid #EF4444;
910
+ border-top: 3px solid #EF4444;
908
911
  }
909
912
 
910
913
  .frp-store-item .price {
911
- font-family: var(--frp-font-display);
912
- font-size: 1.5rem;
913
- font-weight: 700;
914
- color: var(--frp-primary);
914
+ font-family: var(--frp-font-display);
915
+ font-size: 1.5rem;
916
+ font-weight: 700;
917
+ color: var(--frp-primary);
915
918
  }
916
919
 
917
920
  .frp-store-item .price .currency {
918
- font-size: 0.9rem;
919
- color: var(--frp-muted);
921
+ font-size: 0.9rem;
922
+ color: var(--frp-muted);
920
923
  }
921
924
 
922
925
  /* ============================================
923
- CUSTOM: RECENT THREADS WIDGET
924
- ============================================ */
926
+ CUSTOM: RECENT THREADS WIDGET
927
+ ============================================ */
925
928
 
926
929
  .frp-latest-widget {
927
- background: var(--frp-surface);
928
- border: 1px solid var(--frp-border);
929
- border-radius: 4px;
930
- padding: 16px;
930
+ background: var(--frp-surface);
931
+ border: 1px solid var(--frp-border);
932
+ border-radius: 4px;
933
+ padding: 16px;
931
934
  }
932
935
 
933
936
  .frp-latest-widget h4 {
934
- font-family: var(--frp-font-display);
935
- color: var(--frp-primary);
936
- text-transform: uppercase;
937
- letter-spacing: 1px;
938
- border-bottom: 2px solid var(--frp-primary);
939
- padding-bottom: 8px;
940
- margin-bottom: 12px;
941
- font-size: 0.95rem;
937
+ font-family: var(--frp-font-display);
938
+ color: var(--frp-primary);
939
+ text-transform: uppercase;
940
+ letter-spacing: 1px;
941
+ border-bottom: 2px solid var(--frp-primary);
942
+ padding-bottom: 8px;
943
+ margin-bottom: 12px;
944
+ font-size: 0.95rem;
942
945
  }
943
946
 
944
947
  .frp-latest-widget .topic-item {
945
- padding: 8px 0;
946
- border-bottom: 1px solid var(--frp-border);
948
+ padding: 8px 0;
949
+ border-bottom: 1px solid var(--frp-border);
947
950
  }
948
951
 
949
952
  .frp-latest-widget .topic-item:last-child {
950
- border-bottom: none;
953
+ border-bottom: none;
951
954
  }
952
955
 
953
956
  .frp-latest-widget .topic-item a {
954
- color: #e5e7eb;
955
- font-size: 0.9rem;
957
+ color: #e5e7eb;
958
+ font-size: 0.9rem;
956
959
  }
957
960
 
958
961
  .frp-latest-widget .topic-item a:hover {
959
- color: var(--frp-primary);
962
+ color: var(--frp-primary);
960
963
  }
961
964
 
962
965
  .frp-latest-widget .topic-meta {
963
- font-size: 0.75rem;
964
- color: var(--frp-muted);
965
- margin-top: 2px;
966
+ font-size: 0.75rem;
967
+ color: var(--frp-muted);
968
+ margin-top: 2px;
966
969
  }
967
970
 
968
971
  /* ============================================
969
- RESPONSIVE ADJUSTMENTS
970
- ============================================ */
972
+ RESPONSIVE ADJUSTMENTS
973
+ ============================================ */
971
974
 
972
975
  @media (max-width: 768px) {
973
- .navbar .navbar-brand {
974
- font-size: 1rem;
975
- letter-spacing: 1px;
976
- }
976
+ .navbar .navbar-brand {
977
+ font-size: 1rem;
978
+ letter-spacing: 1px;
979
+ }
977
980
 
978
- [component="categories/category"] {
979
- border-left-width: 2px !important;
980
- }
981
+ [component="categories/category"] {
982
+ border-left-width: 2px !important;
983
+ }
981
984
 
982
- .frp-store-item {
983
- padding: 12px;
984
- }
985
+ .frp-store-item {
986
+ padding: 12px;
987
+ }
985
988
 
986
- .frp-game-stats .row {
987
- flex-direction: column;
988
- }
989
+ .frp-game-stats .row {
990
+ flex-direction: column;
991
+ }
989
992
  }
990
993
 
991
994
  @media (max-width: 480px) {
992
- h1, h2 {
993
- font-size: 1.2rem;
994
- }
995
+ h1, h2 {
996
+ font-size: 1.2rem;
997
+ }
995
998
 
996
- .frp-store-item .price {
997
- font-size: 1.2rem;
998
- }
999
+ .frp-store-item .price {
1000
+ font-size: 1.2rem;
1001
+ }
999
1002
  }
1000
1003
 
1001
1004
  /* ============================================
1002
- UTILITY CLASSES
1003
- ============================================ */
1005
+ UTILITY CLASSES
1006
+ ============================================ */
1004
1007
 
1005
1008
  .text-gold { color: var(--frp-primary) !important; }
1006
1009
  .text-danger-frp { color: var(--frp-danger) !important; }