nodebb-plugin-sso-biogrenci 2.0.9 → 2.0.11

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.
package/static/style.less CHANGED
@@ -1 +1,855 @@
1
- /* placeholder — asil CSS NodeBB custom CSS'den verilecek */
1
+ /* ================================================
2
+ bi'öğrenci Premium Fırsatlar
3
+ ================================================ */
4
+
5
+ /* ---------- Light Theme Variables ---------- */
6
+ #biogrenci-firsatlar {
7
+ --bio-primary: #2563eb;
8
+ --bio-primary-dark: #1d4ed8;
9
+ --bio-primary-light: #eff6ff;
10
+ --bio-accent: #f43f5e;
11
+ --bio-bg: #f8fafc;
12
+ --bio-card-bg: rgba(255, 255, 255, 0.85);
13
+ --bio-card-body-bg: #fff;
14
+ --bio-text-main: #0f172a;
15
+ --bio-text-mut: #64748b;
16
+ --bio-border: rgba(226, 232, 240, 0.8);
17
+ --bio-border-glass: rgba(255, 255, 255, 0.5);
18
+ --bio-controls-bg: rgba(255, 255, 255, 0.75);
19
+ --bio-input-bg: rgba(255, 255, 255, 0.9);
20
+ --bio-input-focus-bg: #fff;
21
+ --bio-chip-bg: #fff;
22
+ --bio-chip-hover-bg: #f8fafc;
23
+ --bio-chip-active-bg: #0f172a;
24
+ --bio-chip-active-color: #fff;
25
+ --bio-select-bg: #fff;
26
+ --bio-skeleton-bg: #e2e8f0;
27
+ --bio-shimmer-color: rgba(255, 255, 255, 0.4);
28
+ --bio-empty-bg: rgba(255, 255, 255, 0.5);
29
+ --bio-pager-bg: #fff;
30
+ --bio-tag-bg: rgba(255, 255, 255, 0.9);
31
+ --bio-star-bg: rgba(255, 255, 255, 0.9);
32
+ --bio-placeholder-bg: #f1f5f9;
33
+ --bio-shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
34
+ --bio-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
35
+ --bio-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
36
+ --bio-shadow-glow: 0 0 20px rgba(37, 99, 235, 0.15);
37
+ --bio-card-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 1);
38
+ --bio-card-hover-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 1);
39
+ --bio-hero-gradient: linear-gradient(135deg, #0f172a 0%, #334155 100%);
40
+ --bio-badge-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7));
41
+ --bio-radius: 20px;
42
+ --bio-radius-sm: 12px;
43
+ }
44
+
45
+ /* ---------- Dark Theme Variables ---------- */
46
+ [data-theme="dark"] #biogrenci-firsatlar {
47
+ --bio-primary: #3b82f6;
48
+ --bio-primary-dark: #60a5fa;
49
+ --bio-primary-light: #1e3a5f;
50
+ --bio-bg: #0f172a;
51
+ --bio-card-bg: rgba(30, 41, 59, 0.85);
52
+ --bio-card-body-bg: #1e293b;
53
+ --bio-text-main: #e2e8f0;
54
+ --bio-text-mut: #94a3b8;
55
+ --bio-border: rgba(51, 65, 85, 0.8);
56
+ --bio-border-glass: rgba(51, 65, 85, 0.5);
57
+ --bio-controls-bg: rgba(15, 23, 42, 0.85);
58
+ --bio-input-bg: rgba(30, 41, 59, 0.9);
59
+ --bio-input-focus-bg: #1e293b;
60
+ --bio-chip-bg: #1e293b;
61
+ --bio-chip-hover-bg: #334155;
62
+ --bio-chip-active-bg: #e2e8f0;
63
+ --bio-chip-active-color: #0f172a;
64
+ --bio-select-bg: #1e293b;
65
+ --bio-skeleton-bg: #334155;
66
+ --bio-shimmer-color: rgba(255, 255, 255, 0.06);
67
+ --bio-empty-bg: rgba(30, 41, 59, 0.5);
68
+ --bio-pager-bg: #1e293b;
69
+ --bio-tag-bg: rgba(30, 41, 59, 0.9);
70
+ --bio-star-bg: rgba(30, 41, 59, 0.9);
71
+ --bio-placeholder-bg: #334155;
72
+ --bio-shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.2);
73
+ --bio-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.25), 0 4px 6px -4px rgba(0, 0, 0, 0.2);
74
+ --bio-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 8px 10px -6px rgba(0, 0, 0, 0.2);
75
+ --bio-shadow-glow: 0 0 20px rgba(59, 130, 246, 0.25);
76
+ --bio-card-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.3);
77
+ --bio-card-hover-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.4);
78
+ --bio-hero-gradient: linear-gradient(135deg, #e2e8f0 0%, #94a3b8 100%);
79
+ --bio-badge-bg: linear-gradient(135deg, rgba(30, 41, 59, 0.9), rgba(30, 41, 59, 0.7));
80
+ }
81
+
82
+ /* ---------- Page Container ---------- */
83
+ #biogrenci-firsatlar {
84
+ max-width: 1280px;
85
+ margin: 0 auto;
86
+ padding: 0 20px 80px;
87
+ font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
88
+ color: var(--bio-text-main);
89
+ position: relative;
90
+ overflow-x: hidden;
91
+ }
92
+
93
+ /* ---------- Aurora Animated Background ---------- */
94
+ #biogrenci-firsatlar .bio-aurora {
95
+ position: absolute;
96
+ top: 0;
97
+ left: 0;
98
+ width: 100%;
99
+ height: 600px;
100
+ overflow: hidden;
101
+ z-index: -1;
102
+ pointer-events: none;
103
+ opacity: 0.6;
104
+ }
105
+ #biogrenci-firsatlar .bio-aurora-orb {
106
+ position: absolute;
107
+ border-radius: 50%;
108
+ filter: blur(80px);
109
+ animation: bio-aurora-float 20s infinite alternate ease-in-out;
110
+ }
111
+ #biogrenci-firsatlar .bio-orb-1 {
112
+ width: 400px;
113
+ height: 400px;
114
+ background: rgba(59, 130, 246, 0.3);
115
+ top: -100px;
116
+ left: -100px;
117
+ }
118
+ #biogrenci-firsatlar .bio-orb-2 {
119
+ width: 500px;
120
+ height: 500px;
121
+ background: rgba(236, 72, 153, 0.2);
122
+ top: 100px;
123
+ right: -200px;
124
+ animation-delay: -5s;
125
+ }
126
+ #biogrenci-firsatlar .bio-orb-3 {
127
+ width: 300px;
128
+ height: 300px;
129
+ background: rgba(139, 92, 246, 0.25);
130
+ bottom: -50px;
131
+ left: 30%;
132
+ animation-delay: -10s;
133
+ }
134
+ [data-theme="dark"] #biogrenci-firsatlar .bio-aurora {
135
+ opacity: 0.25;
136
+ }
137
+
138
+ @keyframes bio-aurora-float {
139
+ 0% { transform: translate(0, 0) scale(1); }
140
+ 50% { transform: translate(50px, 30px) scale(1.1); }
141
+ 100% { transform: translate(-30px, -50px) scale(0.9); }
142
+ }
143
+
144
+ /* ---------- Hero Section ---------- */
145
+ #biogrenci-firsatlar .bio-hero {
146
+ padding: 80px 20px 60px;
147
+ text-align: center;
148
+ position: relative;
149
+ z-index: 10;
150
+ }
151
+ #biogrenci-firsatlar .bio-badge-premium {
152
+ display: inline-flex;
153
+ align-items: center;
154
+ gap: 8px;
155
+ background: var(--bio-badge-bg);
156
+ backdrop-filter: blur(10px);
157
+ -webkit-backdrop-filter: blur(10px);
158
+ padding: 8px 20px;
159
+ border-radius: 100px;
160
+ font-size: 13px;
161
+ font-weight: 800;
162
+ color: var(--bio-primary-dark);
163
+ margin-bottom: 24px;
164
+ border: 1px solid var(--bio-border-glass);
165
+ box-shadow: var(--bio-shadow-sm);
166
+ text-transform: uppercase;
167
+ letter-spacing: 1px;
168
+ }
169
+ #biogrenci-firsatlar .bio-badge-premium i { color: #f59e0b; }
170
+ #biogrenci-firsatlar .bio-hero h1 {
171
+ margin: 0 0 16px;
172
+ font-size: 48px;
173
+ font-weight: 900;
174
+ letter-spacing: -1.5px;
175
+ line-height: 1.1;
176
+ background: var(--bio-hero-gradient);
177
+ -webkit-background-clip: text;
178
+ -webkit-text-fill-color: transparent;
179
+ background-clip: text;
180
+ }
181
+ #biogrenci-firsatlar .bio-hero p {
182
+ margin: 0 auto;
183
+ font-size: 18px;
184
+ color: var(--bio-text-mut);
185
+ max-width: 600px;
186
+ line-height: 1.6;
187
+ }
188
+
189
+ /* ---------- Sticky Glass Controls ---------- */
190
+ #biogrenci-firsatlar .bio-controls-wrapper {
191
+ position: sticky;
192
+ top: 70px;
193
+ z-index: 40;
194
+ margin-bottom: 40px;
195
+ padding: 10px 0;
196
+ }
197
+ #biogrenci-firsatlar .bio-controls {
198
+ display: flex;
199
+ align-items: center;
200
+ gap: 16px;
201
+ background: var(--bio-controls-bg);
202
+ backdrop-filter: blur(20px);
203
+ -webkit-backdrop-filter: blur(20px);
204
+ border: 1px solid var(--bio-border-glass);
205
+ padding: 12px 16px;
206
+ border-radius: var(--bio-radius);
207
+ box-shadow: var(--bio-shadow-md);
208
+ flex-wrap: wrap;
209
+ }
210
+
211
+ /* Search */
212
+ #biogrenci-firsatlar .bio-search {
213
+ flex: 1;
214
+ min-width: 200px;
215
+ position: relative;
216
+ }
217
+ #biogrenci-firsatlar .bio-search > i {
218
+ position: absolute;
219
+ left: 20px;
220
+ top: 50%;
221
+ transform: translateY(-50%);
222
+ color: var(--bio-text-mut);
223
+ font-size: 16px;
224
+ z-index: 2;
225
+ transition: color 0.3s ease;
226
+ }
227
+ #biogrenci-firsatlar .bio-search input {
228
+ width: 100%;
229
+ height: 48px;
230
+ padding: 0 20px 0 48px;
231
+ border: 2px solid transparent;
232
+ background: var(--bio-input-bg);
233
+ border-radius: var(--bio-radius-sm);
234
+ font-size: 15px;
235
+ font-weight: 500;
236
+ color: var(--bio-text-main);
237
+ outline: none;
238
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
239
+ box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02);
240
+ box-sizing: border-box;
241
+ }
242
+ #biogrenci-firsatlar .bio-search input::placeholder { color: var(--bio-text-mut); }
243
+ #biogrenci-firsatlar .bio-search input:focus {
244
+ background: var(--bio-input-focus-bg);
245
+ border-color: var(--bio-primary);
246
+ box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
247
+ }
248
+ #biogrenci-firsatlar .bio-search input:focus ~ i { color: var(--bio-primary); }
249
+
250
+ /* Filters */
251
+ #biogrenci-firsatlar .bio-filters {
252
+ display: flex;
253
+ gap: 8px;
254
+ flex-wrap: nowrap;
255
+ overflow-x: auto;
256
+ -webkit-overflow-scrolling: touch;
257
+ scrollbar-width: none;
258
+ padding: 4px 0;
259
+ }
260
+ #biogrenci-firsatlar .bio-filters::-webkit-scrollbar { display: none; }
261
+ #biogrenci-firsatlar .bio-chip {
262
+ display: inline-flex;
263
+ align-items: center;
264
+ gap: 6px;
265
+ padding: 10px 20px;
266
+ border-radius: 100px;
267
+ border: 1px solid var(--bio-border);
268
+ background: var(--bio-chip-bg);
269
+ color: var(--bio-text-mut);
270
+ font-size: 14px;
271
+ font-weight: 600;
272
+ cursor: pointer;
273
+ transition: all 0.25s ease;
274
+ white-space: nowrap;
275
+ box-shadow: var(--bio-shadow-sm);
276
+ -webkit-tap-highlight-color: transparent;
277
+ }
278
+ #biogrenci-firsatlar .bio-chip i { font-size: 13px; }
279
+ #biogrenci-firsatlar .bio-chip:hover {
280
+ background: var(--bio-chip-hover-bg);
281
+ color: var(--bio-text-main);
282
+ }
283
+ #biogrenci-firsatlar .bio-chip.active {
284
+ background: var(--bio-chip-active-bg);
285
+ color: var(--bio-chip-active-color);
286
+ border-color: var(--bio-chip-active-bg);
287
+ box-shadow: 0 8px 16px rgba(15, 23, 42, 0.15);
288
+ }
289
+
290
+ /* Sort */
291
+ #biogrenci-firsatlar .bio-sort {
292
+ position: relative;
293
+ min-width: 160px;
294
+ }
295
+ #biogrenci-firsatlar .bio-sort-icon {
296
+ position: absolute;
297
+ left: 16px;
298
+ top: 50%;
299
+ transform: translateY(-50%);
300
+ color: var(--bio-text-mut);
301
+ pointer-events: none;
302
+ z-index: 2;
303
+ }
304
+ #biogrenci-firsatlar .bio-sort select {
305
+ width: 100%;
306
+ height: 48px;
307
+ padding: 0 40px 0 44px;
308
+ border: 1px solid var(--bio-border);
309
+ border-radius: var(--bio-radius-sm);
310
+ background: var(--bio-select-bg);
311
+ color: var(--bio-text-main);
312
+ font-size: 14px;
313
+ font-weight: 600;
314
+ cursor: pointer;
315
+ outline: none;
316
+ appearance: none;
317
+ -webkit-appearance: none;
318
+ transition: all 0.3s ease;
319
+ box-shadow: var(--bio-shadow-sm);
320
+ box-sizing: border-box;
321
+ }
322
+ #biogrenci-firsatlar .bio-sort::after {
323
+ content: '\f107';
324
+ font-family: 'FontAwesome';
325
+ position: absolute;
326
+ right: 16px;
327
+ top: 50%;
328
+ transform: translateY(-50%);
329
+ color: var(--bio-text-mut);
330
+ pointer-events: none;
331
+ }
332
+ #biogrenci-firsatlar .bio-sort select:focus {
333
+ border-color: var(--bio-primary);
334
+ box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
335
+ }
336
+
337
+ /* ---------- Grid ---------- */
338
+ #biogrenci-firsatlar .bio-grid {
339
+ display: grid !important;
340
+ grid-template-columns: repeat(3, 1fr);
341
+ gap: 24px;
342
+ column-count: unset !important;
343
+ }
344
+
345
+ /* ---------- Premium Card ---------- */
346
+ #biogrenci-firsatlar a.bio-card {
347
+ background: var(--bio-card-bg);
348
+ backdrop-filter: blur(10px);
349
+ -webkit-backdrop-filter: blur(10px);
350
+ border-radius: var(--bio-radius);
351
+ overflow: hidden;
352
+ border: 1px solid var(--bio-border-glass);
353
+ display: flex;
354
+ flex-direction: column;
355
+ transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.35s ease;
356
+ text-decoration: none !important;
357
+ color: inherit !important;
358
+ cursor: pointer;
359
+ box-shadow: var(--bio-card-shadow);
360
+ position: relative;
361
+ animation: bio-card-entrance 0.5s backwards;
362
+ break-inside: avoid;
363
+ margin-bottom: 0;
364
+ }
365
+ #biogrenci-firsatlar a.bio-card:nth-child(3n+2) { animation-delay: 0.06s; }
366
+ #biogrenci-firsatlar a.bio-card:nth-child(3n+3) { animation-delay: 0.12s; }
367
+
368
+ @keyframes bio-card-entrance {
369
+ from { opacity: 0; transform: translateY(24px); }
370
+ to { opacity: 1; transform: translateY(0); }
371
+ }
372
+
373
+ #biogrenci-firsatlar a.bio-card:hover {
374
+ transform: translateY(-8px);
375
+ box-shadow: var(--bio-card-hover-shadow);
376
+ text-decoration: none !important;
377
+ color: inherit !important;
378
+ }
379
+ #biogrenci-firsatlar a.bio-card.featured {
380
+ border: 2px solid rgba(245, 158, 11, 0.4);
381
+ box-shadow: 0 20px 40px rgba(245, 158, 11, 0.08);
382
+ }
383
+
384
+ /* Card Image Area */
385
+ #biogrenci-firsatlar .bio-card-img {
386
+ position: relative;
387
+ overflow: hidden;
388
+ background: var(--bio-placeholder-bg);
389
+ aspect-ratio: 16 / 10;
390
+ }
391
+ #biogrenci-firsatlar .bio-card-img img {
392
+ width: 100%;
393
+ height: 100%;
394
+ object-fit: cover;
395
+ display: block;
396
+ transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
397
+ }
398
+ #biogrenci-firsatlar a.bio-card:hover .bio-card-img img {
399
+ transform: scale(1.05);
400
+ }
401
+ #biogrenci-firsatlar .bio-card-img::after {
402
+ content: '';
403
+ position: absolute;
404
+ top: 0; left: 0; right: 0; bottom: 0;
405
+ background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.55) 100%);
406
+ pointer-events: none;
407
+ opacity: 0.7;
408
+ transition: opacity 0.3s ease;
409
+ }
410
+ #biogrenci-firsatlar a.bio-card:hover .bio-card-img::after {
411
+ opacity: 1;
412
+ }
413
+
414
+ /* Card Image Placeholder */
415
+ #biogrenci-firsatlar .bio-card-ph {
416
+ width: 100%;
417
+ height: 100%;
418
+ display: flex;
419
+ align-items: center;
420
+ justify-content: center;
421
+ background: linear-gradient(135deg, var(--bio-placeholder-bg), var(--bio-border));
422
+ }
423
+ #biogrenci-firsatlar .bio-card-ph i {
424
+ font-size: 42px;
425
+ color: var(--bio-text-mut);
426
+ opacity: 0.25;
427
+ }
428
+
429
+ /* Card Badges */
430
+ #biogrenci-firsatlar .bio-tag {
431
+ position: absolute;
432
+ top: 12px;
433
+ left: 12px;
434
+ padding: 5px 12px;
435
+ border-radius: 100px;
436
+ font-size: 11px;
437
+ font-weight: 800;
438
+ text-transform: uppercase;
439
+ letter-spacing: 0.8px;
440
+ z-index: 2;
441
+ display: inline-flex;
442
+ align-items: center;
443
+ gap: 5px;
444
+ background: var(--bio-tag-bg);
445
+ backdrop-filter: blur(8px);
446
+ -webkit-backdrop-filter: blur(8px);
447
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
448
+ border: 1px solid var(--bio-border-glass);
449
+ }
450
+ #biogrenci-firsatlar .bio-tag-kupon { color: #10b981; }
451
+ #biogrenci-firsatlar .bio-tag-qr { color: var(--bio-primary); }
452
+ #biogrenci-firsatlar .bio-tag-affiliate { color: #f43f5e; }
453
+
454
+ /* Star */
455
+ #biogrenci-firsatlar .bio-star {
456
+ position: absolute;
457
+ top: 12px;
458
+ right: 12px;
459
+ width: 32px;
460
+ height: 32px;
461
+ background: var(--bio-star-bg);
462
+ backdrop-filter: blur(8px);
463
+ border-radius: 50%;
464
+ display: flex;
465
+ align-items: center;
466
+ justify-content: center;
467
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
468
+ z-index: 2;
469
+ border: 1px solid var(--bio-border-glass);
470
+ }
471
+ #biogrenci-firsatlar .bio-star i { color: #f59e0b; font-size: 14px; }
472
+
473
+ /* Timer */
474
+ #biogrenci-firsatlar .bio-timer {
475
+ position: absolute;
476
+ bottom: 0;
477
+ left: 0;
478
+ right: 0;
479
+ padding: 14px 16px;
480
+ color: #fff;
481
+ font-size: 12px;
482
+ font-weight: 600;
483
+ z-index: 2;
484
+ display: flex;
485
+ align-items: center;
486
+ gap: 6px;
487
+ }
488
+ #biogrenci-firsatlar .bio-timer i { color: #facc15; }
489
+
490
+ /* Card Body */
491
+ #biogrenci-firsatlar .bio-card-body {
492
+ padding: 20px;
493
+ display: flex;
494
+ flex-direction: column;
495
+ flex: 1;
496
+ background: var(--bio-card-body-bg);
497
+ }
498
+ #biogrenci-firsatlar .bio-brand {
499
+ font-size: 11px;
500
+ font-weight: 800;
501
+ color: var(--bio-primary);
502
+ text-transform: uppercase;
503
+ letter-spacing: 1.5px;
504
+ margin-bottom: 6px;
505
+ display: block;
506
+ }
507
+ #biogrenci-firsatlar .bio-card-body h3 {
508
+ font-size: 17px;
509
+ font-weight: 800;
510
+ color: var(--bio-text-main);
511
+ margin: 0 0 8px;
512
+ line-height: 1.35;
513
+ display: -webkit-box;
514
+ -webkit-line-clamp: 2;
515
+ -webkit-box-orient: vertical;
516
+ overflow: hidden;
517
+ }
518
+ #biogrenci-firsatlar .bio-card-body p {
519
+ font-size: 13px;
520
+ color: var(--bio-text-mut);
521
+ margin: 0 0 16px;
522
+ line-height: 1.6;
523
+ display: -webkit-box;
524
+ -webkit-line-clamp: 2;
525
+ -webkit-box-orient: vertical;
526
+ overflow: hidden;
527
+ flex: 1;
528
+ }
529
+
530
+ /* CTA Button */
531
+ #biogrenci-firsatlar .bio-cta {
532
+ display: flex;
533
+ align-items: center;
534
+ justify-content: center;
535
+ gap: 8px;
536
+ width: 100%;
537
+ padding: 12px 20px;
538
+ border-radius: var(--bio-radius-sm);
539
+ background: var(--bio-chip-active-bg);
540
+ color: var(--bio-chip-active-color);
541
+ font-size: 14px;
542
+ font-weight: 700;
543
+ margin-top: auto;
544
+ transition: all 0.3s ease;
545
+ letter-spacing: 0.3px;
546
+ }
547
+ #biogrenci-firsatlar a.bio-card:hover .bio-cta {
548
+ background: var(--bio-primary);
549
+ color: #fff;
550
+ box-shadow: var(--bio-shadow-glow);
551
+ }
552
+ #biogrenci-firsatlar .bio-cta i {
553
+ transition: transform 0.3s ease;
554
+ font-size: 12px;
555
+ }
556
+ #biogrenci-firsatlar a.bio-card:hover .bio-cta i {
557
+ transform: translateX(4px);
558
+ }
559
+
560
+ /* ---------- Skeleton Loading ---------- */
561
+ #biogrenci-firsatlar .bio-skeleton-card {
562
+ background: var(--bio-card-body-bg);
563
+ border-radius: var(--bio-radius);
564
+ border: 1px solid var(--bio-border);
565
+ overflow: hidden;
566
+ display: flex;
567
+ flex-direction: column;
568
+ }
569
+ #biogrenci-firsatlar .bio-shimmer {
570
+ background: var(--bio-skeleton-bg);
571
+ background-image: linear-gradient(
572
+ 90deg,
573
+ rgba(255, 255, 255, 0) 0,
574
+ var(--bio-shimmer-color) 20%,
575
+ var(--bio-shimmer-color) 60%,
576
+ rgba(255, 255, 255, 0)
577
+ );
578
+ background-size: 200% 100%;
579
+ animation: bio-shimmer 1.5s infinite linear;
580
+ }
581
+ #biogrenci-firsatlar .bio-skel-img { height: 180px; width: 100%; }
582
+ #biogrenci-firsatlar .bio-skel-body { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
583
+ #biogrenci-firsatlar .bio-skel-brand { height: 14px; width: 40%; border-radius: 4px; }
584
+ #biogrenci-firsatlar .bio-skel-title { height: 20px; width: 90%; border-radius: 4px; }
585
+ #biogrenci-firsatlar .bio-skel-desc { height: 14px; width: 100%; border-radius: 4px; }
586
+ #biogrenci-firsatlar .bio-skel-btn { height: 44px; width: 100%; border-radius: var(--bio-radius-sm); margin-top: 8px; }
587
+
588
+ @keyframes bio-shimmer {
589
+ 0% { background-position: -200% 0; }
590
+ 100% { background-position: 200% 0; }
591
+ }
592
+
593
+ /* ---------- Empty State ---------- */
594
+ #biogrenci-firsatlar .bio-state.bio-empty {
595
+ grid-column: 1 / -1;
596
+ text-align: center;
597
+ padding: 80px 20px;
598
+ background: var(--bio-empty-bg);
599
+ backdrop-filter: blur(10px);
600
+ border-radius: var(--bio-radius);
601
+ border: 1px dashed var(--bio-border);
602
+ }
603
+ #biogrenci-firsatlar .bio-state.bio-empty i {
604
+ font-size: 56px;
605
+ color: var(--bio-text-mut);
606
+ opacity: 0.4;
607
+ margin-bottom: 20px;
608
+ display: block;
609
+ }
610
+ #biogrenci-firsatlar .bio-state.bio-empty h3 {
611
+ font-size: 22px;
612
+ font-weight: 800;
613
+ color: var(--bio-text-main);
614
+ margin: 0 0 8px;
615
+ }
616
+ #biogrenci-firsatlar .bio-state.bio-empty p {
617
+ color: var(--bio-text-mut);
618
+ font-size: 15px;
619
+ margin: 0;
620
+ }
621
+
622
+ /* ---------- Pagination ---------- */
623
+ #biogrenci-firsatlar .bio-pager {
624
+ display: flex;
625
+ justify-content: center;
626
+ align-items: center;
627
+ gap: 12px;
628
+ margin-top: 48px;
629
+ }
630
+ #biogrenci-firsatlar .bio-pager-btn {
631
+ width: 48px;
632
+ height: 48px;
633
+ border-radius: 50%;
634
+ border: 1px solid var(--bio-border);
635
+ background: var(--bio-pager-bg);
636
+ color: var(--bio-text-main);
637
+ display: flex;
638
+ align-items: center;
639
+ justify-content: center;
640
+ cursor: pointer;
641
+ transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
642
+ font-size: 15px;
643
+ box-shadow: var(--bio-shadow-sm);
644
+ -webkit-tap-highlight-color: transparent;
645
+ }
646
+ #biogrenci-firsatlar .bio-pager-btn:hover:not(:disabled) {
647
+ background: var(--bio-primary);
648
+ color: #fff;
649
+ border-color: var(--bio-primary);
650
+ transform: scale(1.1);
651
+ box-shadow: var(--bio-shadow-glow);
652
+ }
653
+ #biogrenci-firsatlar .bio-pager-btn:disabled {
654
+ opacity: 0.35;
655
+ cursor: not-allowed;
656
+ box-shadow: none;
657
+ }
658
+ #biogrenci-firsatlar .bio-page-bubble {
659
+ background: var(--bio-pager-bg);
660
+ padding: 12px 24px;
661
+ border-radius: 100px;
662
+ font-size: 14px;
663
+ font-weight: 800;
664
+ color: var(--bio-text-main);
665
+ box-shadow: var(--bio-shadow-sm);
666
+ border: 1px solid var(--bio-border);
667
+ }
668
+
669
+ /* ==============================================
670
+ RESPONSIVE
671
+ ============================================== */
672
+
673
+ /* ---------- Tablet (1024px) ---------- */
674
+ @media (max-width: 1024px) {
675
+ #biogrenci-firsatlar .bio-grid {
676
+ grid-template-columns: repeat(2, 1fr) !important;
677
+ gap: 20px;
678
+ }
679
+ #biogrenci-firsatlar .bio-hero h1 { font-size: 40px; }
680
+ }
681
+
682
+ /* ---------- Mobile (768px) ---------- */
683
+ @media (max-width: 768px) {
684
+ #biogrenci-firsatlar {
685
+ padding: 0 12px 60px;
686
+ }
687
+ #biogrenci-firsatlar .bio-aurora { height: 350px; }
688
+
689
+ /* Hero */
690
+ #biogrenci-firsatlar .bio-hero {
691
+ padding: 32px 8px 20px;
692
+ }
693
+ #biogrenci-firsatlar .bio-hero h1 {
694
+ font-size: 28px;
695
+ letter-spacing: -0.8px;
696
+ }
697
+ #biogrenci-firsatlar .bio-hero p {
698
+ font-size: 14px;
699
+ }
700
+ #biogrenci-firsatlar .bio-badge-premium {
701
+ font-size: 10px;
702
+ padding: 6px 12px;
703
+ margin-bottom: 14px;
704
+ gap: 6px;
705
+ }
706
+
707
+ /* Controls */
708
+ #biogrenci-firsatlar .bio-controls-wrapper {
709
+ top: 56px;
710
+ margin-bottom: 20px;
711
+ padding: 4px 0;
712
+ }
713
+ #biogrenci-firsatlar .bio-controls {
714
+ flex-direction: column;
715
+ padding: 10px;
716
+ gap: 8px;
717
+ border-radius: 14px;
718
+ }
719
+ #biogrenci-firsatlar .bio-search {
720
+ width: 100%;
721
+ min-width: 0;
722
+ }
723
+ #biogrenci-firsatlar .bio-search input {
724
+ height: 42px;
725
+ font-size: 14px;
726
+ padding: 0 14px 0 40px;
727
+ }
728
+ #biogrenci-firsatlar .bio-search > i {
729
+ left: 14px;
730
+ font-size: 14px;
731
+ }
732
+ #biogrenci-firsatlar .bio-filters {
733
+ width: 100%;
734
+ gap: 6px;
735
+ padding: 2px 0;
736
+ }
737
+ #biogrenci-firsatlar .bio-chip {
738
+ padding: 8px 14px;
739
+ font-size: 12px;
740
+ gap: 4px;
741
+ }
742
+ #biogrenci-firsatlar .bio-sort {
743
+ width: 100%;
744
+ min-width: 0;
745
+ }
746
+ #biogrenci-firsatlar .bio-sort select {
747
+ height: 42px;
748
+ font-size: 13px;
749
+ }
750
+
751
+ /* Grid — 2 columns on mobile */
752
+ #biogrenci-firsatlar .bio-grid {
753
+ grid-template-columns: repeat(2, 1fr) !important;
754
+ gap: 10px;
755
+ }
756
+
757
+ /* Card */
758
+ #biogrenci-firsatlar a.bio-card {
759
+ border-radius: 12px;
760
+ }
761
+ #biogrenci-firsatlar .bio-card-body {
762
+ padding: 12px;
763
+ }
764
+ #biogrenci-firsatlar .bio-card-body h3 {
765
+ font-size: 13px;
766
+ margin: 0 0 4px;
767
+ -webkit-line-clamp: 2;
768
+ }
769
+ #biogrenci-firsatlar .bio-card-body p {
770
+ font-size: 11px;
771
+ margin: 0 0 10px;
772
+ -webkit-line-clamp: 2;
773
+ }
774
+ #biogrenci-firsatlar .bio-brand {
775
+ font-size: 9px;
776
+ letter-spacing: 1px;
777
+ margin-bottom: 3px;
778
+ }
779
+ #biogrenci-firsatlar .bio-cta {
780
+ padding: 9px 12px;
781
+ font-size: 12px;
782
+ border-radius: 8px;
783
+ gap: 6px;
784
+ }
785
+ #biogrenci-firsatlar .bio-tag {
786
+ top: 8px;
787
+ left: 8px;
788
+ padding: 3px 8px;
789
+ font-size: 8px;
790
+ letter-spacing: 0.4px;
791
+ gap: 3px;
792
+ }
793
+ #biogrenci-firsatlar .bio-star {
794
+ top: 8px;
795
+ right: 8px;
796
+ width: 24px;
797
+ height: 24px;
798
+ }
799
+ #biogrenci-firsatlar .bio-star i { font-size: 10px; }
800
+ #biogrenci-firsatlar .bio-timer {
801
+ padding: 8px 10px;
802
+ font-size: 10px;
803
+ gap: 4px;
804
+ }
805
+
806
+ /* Skeleton */
807
+ #biogrenci-firsatlar .bio-skeleton-card { border-radius: 12px; }
808
+ #biogrenci-firsatlar .bio-skel-img { height: 120px; }
809
+ #biogrenci-firsatlar .bio-skel-body { padding: 12px; gap: 8px; }
810
+ #biogrenci-firsatlar .bio-skel-btn { height: 36px; }
811
+
812
+ /* Pager */
813
+ #biogrenci-firsatlar .bio-pager { margin-top: 28px; gap: 8px; }
814
+ #biogrenci-firsatlar .bio-pager-btn { width: 40px; height: 40px; font-size: 13px; }
815
+ #biogrenci-firsatlar .bio-page-bubble { padding: 8px 16px; font-size: 12px; }
816
+
817
+ /* Empty */
818
+ #biogrenci-firsatlar .bio-state.bio-empty { padding: 50px 14px; }
819
+ #biogrenci-firsatlar .bio-state.bio-empty i { font-size: 36px; margin-bottom: 14px; }
820
+ #biogrenci-firsatlar .bio-state.bio-empty h3 { font-size: 17px; }
821
+ #biogrenci-firsatlar .bio-state.bio-empty p { font-size: 13px; }
822
+
823
+ /* Placeholder */
824
+ #biogrenci-firsatlar .bio-card-ph i { font-size: 28px; }
825
+ }
826
+
827
+ /* ---------- Small Mobile (420px) ---------- */
828
+ @media (max-width: 420px) {
829
+ #biogrenci-firsatlar .bio-hero h1 { font-size: 24px; }
830
+ #biogrenci-firsatlar .bio-hero p { font-size: 13px; }
831
+ #biogrenci-firsatlar .bio-chip {
832
+ padding: 7px 10px;
833
+ font-size: 11px;
834
+ }
835
+ }
836
+
837
+ /* ---------- Touch Devices ---------- */
838
+ @media (hover: none) {
839
+ #biogrenci-firsatlar a.bio-card:hover {
840
+ transform: none;
841
+ box-shadow: var(--bio-card-shadow);
842
+ }
843
+ #biogrenci-firsatlar a.bio-card:active {
844
+ transform: scale(0.97);
845
+ transition-duration: 0.15s;
846
+ }
847
+ #biogrenci-firsatlar .bio-chip:hover {
848
+ background: var(--bio-chip-bg);
849
+ color: var(--bio-text-mut);
850
+ }
851
+ #biogrenci-firsatlar .bio-chip.active:hover {
852
+ background: var(--bio-chip-active-bg);
853
+ color: var(--bio-chip-active-color);
854
+ }
855
+ }