quikchat 1.2.4 → 1.2.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.
Files changed (41) hide show
  1. package/README.md +9 -4
  2. package/dist/build-manifest.json +73 -80
  3. package/dist/quikchat-md-full.cjs.js +630 -256
  4. package/dist/quikchat-md-full.cjs.js.map +1 -1
  5. package/dist/quikchat-md-full.cjs.min.js +3 -3
  6. package/dist/quikchat-md-full.cjs.min.js.map +1 -1
  7. package/dist/quikchat-md-full.esm.js +630 -256
  8. package/dist/quikchat-md-full.esm.js.map +1 -1
  9. package/dist/quikchat-md-full.esm.min.js +3 -3
  10. package/dist/quikchat-md-full.esm.min.js.map +1 -1
  11. package/dist/quikchat-md-full.umd.js +630 -256
  12. package/dist/quikchat-md-full.umd.js.map +1 -1
  13. package/dist/quikchat-md-full.umd.min.js +3 -3
  14. package/dist/quikchat-md-full.umd.min.js.map +1 -1
  15. package/dist/quikchat-md.cjs.js +614 -246
  16. package/dist/quikchat-md.cjs.js.map +1 -1
  17. package/dist/quikchat-md.cjs.min.js +3 -3
  18. package/dist/quikchat-md.cjs.min.js.map +1 -1
  19. package/dist/quikchat-md.esm.js +614 -246
  20. package/dist/quikchat-md.esm.js.map +1 -1
  21. package/dist/quikchat-md.esm.min.js +3 -3
  22. package/dist/quikchat-md.esm.min.js.map +1 -1
  23. package/dist/quikchat-md.umd.js +614 -246
  24. package/dist/quikchat-md.umd.js.map +1 -1
  25. package/dist/quikchat-md.umd.min.js +3 -3
  26. package/dist/quikchat-md.umd.min.js.map +1 -1
  27. package/dist/quikchat.cjs.js +3 -3
  28. package/dist/quikchat.cjs.js.map +1 -1
  29. package/dist/quikchat.cjs.min.js +1 -1
  30. package/dist/quikchat.cjs.min.js.map +1 -1
  31. package/dist/quikchat.css +351 -120
  32. package/dist/quikchat.esm.js +3 -3
  33. package/dist/quikchat.esm.js.map +1 -1
  34. package/dist/quikchat.esm.min.js +1 -1
  35. package/dist/quikchat.esm.min.js.map +1 -1
  36. package/dist/quikchat.min.css +1 -1
  37. package/dist/quikchat.umd.js +3 -3
  38. package/dist/quikchat.umd.js.map +1 -1
  39. package/dist/quikchat.umd.min.js +1 -1
  40. package/dist/quikchat.umd.min.js.map +1 -1
  41. package/package.json +6 -5
package/dist/quikchat.css CHANGED
@@ -79,7 +79,6 @@
79
79
  overflow-y: hidden;
80
80
  font-family: inherit;
81
81
  font-size: inherit;
82
- --quikchat-input-max-height: 120px;
83
82
  }
84
83
 
85
84
  .quikchat-input-send-btn {
@@ -280,115 +279,119 @@
280
279
  /* ================================== */
281
280
 
282
281
  .quikchat-theme-dark {
283
- border: 1px solid #555555;
284
- border-radius: 10px;
285
- background-color: #212121;
286
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
287
- color: #eceff1;
282
+ border: 1px solid #3a3a3a;
283
+ border-radius: 12px;
284
+ background-color: #1a1a1a;
285
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
286
+ color: #e8e8e8;
288
287
  }
289
288
 
290
289
  .quikchat-theme-dark .quikchat-title-area {
291
- background-color: #212121;
292
- color: #eceff1;
293
- border-bottom: 1px solid #37474f;
290
+ background-color: #1a1a1a;
291
+ color: #f0f0f0;
292
+ border-bottom: 1px solid #2a2a2a;
294
293
  }
295
294
 
296
295
  .quikchat-theme-dark .quikchat-messages-area {
297
- background-color: #212121;
298
- color: #eceff1;
299
- border-radius: 1em;
296
+ background-color: #1a1a1a;
297
+ color: #e8e8e8;
300
298
  }
301
299
 
302
300
  .quikchat-theme-dark .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
303
- background-color: #404040e5;
304
- color: #eceff1;
305
- border-radius: 4px;
301
+ background-color: #1e1e1e;
302
+ color: #e8e8e8;
303
+ border-radius: 6px;
306
304
  }
307
305
 
308
306
  .quikchat-theme-dark .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
309
- background-color: #5a5a5a;
310
- color: #fbfbfb;
311
- border-radius: 4px;
307
+ background-color: #262626;
308
+ color: #f0f0f0;
309
+ border-radius: 6px;
312
310
  }
313
311
 
314
312
  .quikchat-theme-dark .quikchat-input-area {
315
- background-color: #263238;
316
- border-bottom-left-radius: 10px;
317
- border-bottom-right-radius: 10px;
313
+ background-color: #1e1e1e;
314
+ border-top: 1px solid #2a2a2a;
315
+ border-bottom-left-radius: 12px;
316
+ border-bottom-right-radius: 12px;
318
317
  }
319
318
 
320
319
  .quikchat-theme-dark .quikchat-input-textbox {
321
- background-color: #424242;
322
- color: #eceff1;
323
- border: 1px solid #555;
324
- border-radius: 4px;
320
+ background-color: #2a2a2a;
321
+ color: #e8e8e8;
322
+ border: 1px solid #3a3a3a;
323
+ border-radius: 8px;
325
324
  }
326
325
 
327
326
  .quikchat-theme-dark .quikchat-input-send-btn {
328
- background-color: #1b5e20;
329
- color: white;
327
+ background-color: #22c55e;
328
+ color: #0a0a0a;
330
329
  border: none;
331
- border-radius: 4px;
330
+ border-radius: 8px;
331
+ font-weight: 600;
332
332
  }
333
333
 
334
334
  .quikchat-theme-dark .quikchat-input-send-btn:hover {
335
- background-color: #2e7d32;
335
+ background-color: #16a34a;
336
336
  }
337
337
 
338
338
  /* ================================== */
339
339
  /* Theme: light */
340
+ /* Clean white with subtle warmth */
340
341
  /* ================================== */
341
342
 
342
343
  .quikchat-theme-light {
343
- border: 1px solid #cccccc;
344
- border-radius: 10px;
345
- background-color: #f9f9f9;
344
+ border: 1px solid #e0e0e0;
345
+ border-radius: 12px;
346
+ background-color: #ffffff;
347
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
346
348
  }
347
349
 
348
350
  .quikchat-theme-light .quikchat-title-area {
349
- color: #333;
351
+ color: #1a1a1a;
352
+ border-bottom: 1px solid #f0f0f0;
350
353
  }
351
354
 
352
355
  .quikchat-theme-light .quikchat-messages-area {
353
- background-color: #ffffffe2;
354
- color: #333;
355
- border-radius: 1em;
356
+ background-color: #ffffff;
357
+ color: #2d2d2d;
356
358
  }
357
359
 
358
360
  .quikchat-theme-light .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
359
361
  background-color: #ffffff;
360
- color: #005662;
361
- border-radius: 4px;
362
+ color: #2d2d2d;
363
+ border-radius: 6px;
362
364
  }
363
365
 
364
366
  .quikchat-theme-light .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
365
- background-color: #e8e8e8;
366
- color: #353535;
367
- border-radius: 4px;
367
+ background-color: #f7f7f8;
368
+ color: #2d2d2d;
369
+ border-radius: 6px;
368
370
  }
369
371
 
370
372
  .quikchat-theme-light .quikchat-input-area {
371
- background-color: #f9f9f9;
372
- border-bottom-left-radius: 10px;
373
- border-bottom-right-radius: 10px;
373
+ background-color: #fafafa;
374
+ border-top: 1px solid #f0f0f0;
375
+ border-bottom-left-radius: 12px;
376
+ border-bottom-right-radius: 12px;
374
377
  }
375
378
 
376
379
  .quikchat-theme-light .quikchat-input-textbox {
377
380
  background-color: #ffffff;
378
- color: #333;
379
- border: 1px solid #ccc;
380
- border-radius: 4px;
381
+ color: #2d2d2d;
382
+ border: 1px solid #d8d8d8;
383
+ border-radius: 8px;
381
384
  }
382
385
 
383
386
  .quikchat-theme-light .quikchat-input-send-btn {
384
- background-color: #4caf50;
387
+ background-color: #2563eb;
385
388
  color: white;
386
389
  border: none;
387
- border-radius: 4px;
390
+ border-radius: 8px;
388
391
  }
389
392
 
390
393
  .quikchat-theme-light .quikchat-input-send-btn:hover {
391
- background-color: #43a047;
394
+ background-color: #1d4ed8;
392
395
  }
393
396
 
394
397
  /* ================================== */
@@ -397,56 +400,57 @@
397
400
  /* ================================== */
398
401
 
399
402
  .quikchat-theme-blue {
400
- border: 1px solid #b0c4d8;
401
- border-radius: 10px;
402
- background-color: #eef3f8;
403
+ border: 1px solid #c0d4e8;
404
+ border-radius: 12px;
405
+ background-color: #f0f5fa;
406
+ box-shadow: 0 2px 8px rgba(58, 110, 165, 0.08);
403
407
  }
404
408
 
405
409
  .quikchat-theme-blue .quikchat-title-area {
406
- background-color: #3a6ea5;
410
+ background: linear-gradient(135deg, #3a6ea5, #2d5a8a);
407
411
  color: #fff;
408
- border-radius: 9px 9px 0 0;
412
+ border-radius: 11px 11px 0 0;
409
413
  }
410
414
 
411
415
  .quikchat-theme-blue .quikchat-messages-area {
412
- background-color: #f5f8fb;
416
+ background-color: #f8fafc;
413
417
  color: #1a2a3a;
414
418
  }
415
419
 
416
420
  .quikchat-theme-blue .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
417
- background-color: #f5f8fb;
421
+ background-color: #f8fafc;
418
422
  color: #1a2a3a;
419
- border-radius: 4px;
423
+ border-radius: 6px;
420
424
  }
421
425
 
422
426
  .quikchat-theme-blue .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
423
- background-color: #dde8f0;
427
+ background-color: #e8f0f8;
424
428
  color: #1a2a3a;
425
- border-radius: 4px;
429
+ border-radius: 6px;
426
430
  }
427
431
 
428
432
  .quikchat-theme-blue .quikchat-input-area {
429
433
  background-color: #eef3f8;
430
- border-bottom-left-radius: 10px;
431
- border-bottom-right-radius: 10px;
434
+ border-bottom-left-radius: 12px;
435
+ border-bottom-right-radius: 12px;
432
436
  }
433
437
 
434
438
  .quikchat-theme-blue .quikchat-input-textbox {
435
439
  background-color: #fff;
436
440
  color: #1a2a3a;
437
- border: 1px solid #b0c4d8;
438
- border-radius: 4px;
441
+ border: 1px solid #b8ccdf;
442
+ border-radius: 8px;
439
443
  }
440
444
 
441
445
  .quikchat-theme-blue .quikchat-input-send-btn {
442
- background-color: #3a6ea5;
446
+ background: linear-gradient(135deg, #3a6ea5, #2d5a8a);
443
447
  color: white;
444
448
  border: none;
445
- border-radius: 4px;
449
+ border-radius: 8px;
446
450
  }
447
451
 
448
452
  .quikchat-theme-blue .quikchat-input-send-btn:hover {
449
- background-color: #2d5a8a;
453
+ background: linear-gradient(135deg, #2d5a8a, #1e4a75);
450
454
  }
451
455
 
452
456
  /* ================================== */
@@ -455,74 +459,78 @@
455
459
  /* ================================== */
456
460
 
457
461
  .quikchat-theme-warm {
458
- border: 1px solid #d4b896;
459
- border-radius: 10px;
460
- background-color: #faf6f0;
462
+ border: 1px solid #dcc8aa;
463
+ border-radius: 12px;
464
+ background-color: #fdf8f2;
465
+ box-shadow: 0 1px 6px rgba(180, 140, 80, 0.08);
461
466
  }
462
467
 
463
468
  .quikchat-theme-warm .quikchat-title-area {
464
- background-color: #faf6f0;
469
+ background-color: #fdf8f2;
465
470
  color: #5a3e28;
466
- border-bottom: 1px solid #e0cdb8;
471
+ border-bottom: 1px solid #eedcc8;
467
472
  }
468
473
 
469
474
  .quikchat-theme-warm .quikchat-messages-area {
470
- background-color: #fdf9f4;
475
+ background-color: #fefbf6;
471
476
  color: #3a2a1a;
472
477
  }
473
478
 
474
479
  .quikchat-theme-warm .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
475
- background-color: #fdf9f4;
480
+ background-color: #fefbf6;
476
481
  color: #3a2a1a;
477
- border-radius: 4px;
482
+ border-radius: 6px;
478
483
  }
479
484
 
480
485
  .quikchat-theme-warm .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
481
- background-color: #f0e6d8;
486
+ background-color: #f5ebe0;
482
487
  color: #3a2a1a;
483
- border-radius: 4px;
488
+ border-radius: 6px;
484
489
  }
485
490
 
486
491
  .quikchat-theme-warm .quikchat-input-area {
487
- background-color: #faf6f0;
488
- border-bottom-left-radius: 10px;
489
- border-bottom-right-radius: 10px;
492
+ background-color: #faf5ee;
493
+ border-top: 1px solid #eedcc8;
494
+ border-bottom-left-radius: 12px;
495
+ border-bottom-right-radius: 12px;
490
496
  }
491
497
 
492
498
  .quikchat-theme-warm .quikchat-input-textbox {
493
499
  background-color: #fff;
494
500
  color: #3a2a1a;
495
- border: 1px solid #d4b896;
496
- border-radius: 4px;
501
+ border: 1px solid #dcc8aa;
502
+ border-radius: 8px;
497
503
  }
498
504
 
499
505
  .quikchat-theme-warm .quikchat-input-send-btn {
500
- background-color: #b5784a;
506
+ background: linear-gradient(135deg, #c17f4a, #a5683a);
501
507
  color: white;
502
508
  border: none;
503
- border-radius: 4px;
509
+ border-radius: 8px;
504
510
  }
505
511
 
506
512
  .quikchat-theme-warm .quikchat-input-send-btn:hover {
507
- background-color: #9a6438;
513
+ background: linear-gradient(135deg, #a5683a, #8a5530);
508
514
  }
509
515
 
510
516
  /* ================================== */
511
517
  /* Theme: midnight */
512
- /* Deep navy with brighter accents */
518
+ /* Deep navy with starlight accents */
513
519
  /* ================================== */
514
520
 
515
521
  .quikchat-theme-midnight {
516
522
  border: 1px solid #2a3a5c;
517
- border-radius: 10px;
523
+ border-radius: 12px;
518
524
  background-color: #0f1626;
525
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
519
526
  color: #c8d0e0;
520
527
  }
521
528
 
522
529
  .quikchat-theme-midnight .quikchat-title-area {
523
- background-color: #0f1626;
530
+ background: linear-gradient(135deg, #1a2744, #0f1626);
524
531
  color: #8eaadc;
525
532
  border-bottom: 1px solid #1e2d4a;
533
+ border-radius: 11px 11px 0 0;
526
534
  }
527
535
 
528
536
  .quikchat-theme-midnight .quikchat-messages-area {
@@ -533,37 +541,39 @@
533
541
  .quikchat-theme-midnight .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
534
542
  background-color: #0f1830;
535
543
  color: #c8d0e0;
536
- border-radius: 4px;
544
+ border-radius: 6px;
537
545
  }
538
546
 
539
547
  .quikchat-theme-midnight .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
540
548
  background-color: #162040;
541
549
  color: #d0d8e8;
542
- border-radius: 4px;
550
+ border-radius: 6px;
543
551
  }
544
552
 
545
553
  .quikchat-theme-midnight .quikchat-input-area {
546
554
  background-color: #0f1626;
547
- border-bottom-left-radius: 10px;
548
- border-bottom-right-radius: 10px;
555
+ border-top: 1px solid #1e2d4a;
556
+ border-bottom-left-radius: 12px;
557
+ border-bottom-right-radius: 12px;
549
558
  }
550
559
 
551
560
  .quikchat-theme-midnight .quikchat-input-textbox {
552
561
  background-color: #1a2540;
553
562
  color: #c8d0e0;
554
563
  border: 1px solid #2a3a5c;
555
- border-radius: 4px;
564
+ border-radius: 8px;
556
565
  }
557
566
 
558
567
  .quikchat-theme-midnight .quikchat-input-send-btn {
559
- background-color: #4a6fa5;
568
+ background: linear-gradient(135deg, #4a6fa5, #3a5a8a);
560
569
  color: white;
561
570
  border: none;
562
- border-radius: 4px;
571
+ border-radius: 8px;
572
+ font-weight: 600;
563
573
  }
564
574
 
565
575
  .quikchat-theme-midnight .quikchat-input-send-btn:hover {
566
- background-color: #5a80b8;
576
+ background: linear-gradient(135deg, #5a80b8, #4a6fa5);
567
577
  }
568
578
 
569
579
  /* ================================== */
@@ -573,15 +583,17 @@
573
583
 
574
584
  .quikchat-theme-ocean {
575
585
  border: 1px solid #1a6b7a;
576
- border-radius: 10px;
586
+ border-radius: 12px;
577
587
  background-color: #0d2b36;
588
+ box-shadow: 0 4px 20px rgba(0, 40, 60, 0.4);
578
589
  color: #d4edee;
579
590
  }
580
591
 
581
592
  .quikchat-theme-ocean .quikchat-title-area {
582
- background-color: #0d2b36;
593
+ background: linear-gradient(135deg, #0d3a4a, #0d2b36);
583
594
  color: #5ec4d4;
584
595
  border-bottom: 1px solid #1a4a5a;
596
+ border-radius: 11px 11px 0 0;
585
597
  }
586
598
 
587
599
  .quikchat-theme-ocean .quikchat-messages-area {
@@ -592,54 +604,58 @@
592
604
  .quikchat-theme-ocean .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
593
605
  background-color: #0d3040;
594
606
  color: #d4edee;
595
- border-radius: 4px;
607
+ border-radius: 6px;
596
608
  }
597
609
 
598
610
  .quikchat-theme-ocean .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
599
611
  background-color: #11384a;
600
612
  color: #d4edee;
601
- border-radius: 4px;
613
+ border-radius: 6px;
602
614
  }
603
615
 
604
616
  .quikchat-theme-ocean .quikchat-input-area {
605
617
  background-color: #0d2b36;
606
- border-bottom-left-radius: 10px;
607
- border-bottom-right-radius: 10px;
618
+ border-top: 1px solid #1a4a5a;
619
+ border-bottom-left-radius: 12px;
620
+ border-bottom-right-radius: 12px;
608
621
  }
609
622
 
610
623
  .quikchat-theme-ocean .quikchat-input-textbox {
611
624
  background-color: #163a48;
612
625
  color: #d4edee;
613
626
  border: 1px solid #1a5a6a;
614
- border-radius: 4px;
627
+ border-radius: 8px;
615
628
  }
616
629
 
617
630
  .quikchat-theme-ocean .quikchat-input-send-btn {
618
- background-color: #1a8a6a;
631
+ background: linear-gradient(135deg, #1a8a6a, #15705a);
619
632
  color: white;
620
633
  border: none;
621
- border-radius: 4px;
634
+ border-radius: 8px;
635
+ font-weight: 600;
622
636
  }
623
637
 
624
638
  .quikchat-theme-ocean .quikchat-input-send-btn:hover {
625
- background-color: #1fa07a;
639
+ background: linear-gradient(135deg, #1fa07a, #1a8a6a);
626
640
  }
627
641
 
628
642
  /* ================================== */
629
643
  /* Theme: modern */
630
- /* Message bubbles, ChatGPT-style */
644
+ /* Message bubbles, iMessage-style */
631
645
  /* ================================== */
632
646
 
633
647
  .quikchat-theme-modern {
634
648
  border: 1px solid #e5e5e5;
635
649
  border-radius: 12px;
636
650
  background-color: #ffffff;
651
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
637
652
  }
638
653
 
639
654
  .quikchat-theme-modern .quikchat-title-area {
640
- background-color: #ffffff;
655
+ background-color: #fafafa;
641
656
  color: #1a1a1a;
642
657
  border-bottom: 1px solid #f0f0f0;
658
+ border-radius: 11px 11px 0 0;
643
659
  }
644
660
 
645
661
  .quikchat-theme-modern .quikchat-messages-area {
@@ -666,11 +682,12 @@
666
682
 
667
683
  .quikchat-theme-modern .quikchat-message-content {
668
684
  max-width: 80%;
669
- border-radius: 16px;
685
+ border-radius: 18px;
686
+ padding: 2px 4px;
670
687
  }
671
688
 
672
689
  .quikchat-theme-modern .quikchat-align-right .quikchat-message-content {
673
- background-color: #0b93f6;
690
+ background: linear-gradient(135deg, #0b93f6, #0078d4);
674
691
  color: #ffffff;
675
692
  border-bottom-right-radius: 4px;
676
693
  }
@@ -688,10 +705,11 @@
688
705
 
689
706
  .quikchat-theme-modern .quikchat-user-label {
690
707
  color: #888;
708
+ font-size: 0.85em;
691
709
  }
692
710
 
693
711
  .quikchat-theme-modern .quikchat-input-area {
694
- background-color: #ffffff;
712
+ background-color: #fafafa;
695
713
  border-top: 1px solid #f0f0f0;
696
714
  border-bottom-left-radius: 12px;
697
715
  border-bottom-right-radius: 12px;
@@ -705,14 +723,206 @@
705
723
  }
706
724
 
707
725
  .quikchat-theme-modern .quikchat-input-send-btn {
708
- background-color: #0b93f6;
726
+ background: linear-gradient(135deg, #0b93f6, #0078d4);
709
727
  color: white;
710
728
  border: none;
711
729
  border-radius: 20px;
730
+ font-weight: 600;
712
731
  }
713
732
 
714
733
  .quikchat-theme-modern .quikchat-input-send-btn:hover {
715
- background-color: #0a84de;
734
+ background: linear-gradient(135deg, #0a84de, #006abc);
735
+ }
736
+
737
+ /* ================================== */
738
+ /* Theme: glass */
739
+ /* Glassmorphism: frosted translucent */
740
+ /* ================================== */
741
+
742
+ .quikchat-theme-glass {
743
+ border: 1px solid rgba(255, 255, 255, 0.3);
744
+ border-radius: 16px;
745
+ background: rgba(255, 255, 255, 0.15);
746
+ backdrop-filter: blur(16px);
747
+ -webkit-backdrop-filter: blur(16px);
748
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
749
+ color: #1a1a2e;
750
+ }
751
+
752
+ .quikchat-theme-glass .quikchat-title-area {
753
+ background: rgba(255, 255, 255, 0.2);
754
+ color: #1a1a2e;
755
+ border-bottom: 1px solid rgba(255, 255, 255, 0.2);
756
+ border-radius: 15px 15px 0 0;
757
+ }
758
+
759
+ .quikchat-theme-glass .quikchat-messages-area {
760
+ background: rgba(255, 255, 255, 0.08);
761
+ color: #1a1a2e;
762
+ }
763
+
764
+ .quikchat-theme-glass .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
765
+ background: rgba(255, 255, 255, 0.12);
766
+ border-radius: 8px;
767
+ }
768
+
769
+ .quikchat-theme-glass .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
770
+ background: rgba(255, 255, 255, 0.22);
771
+ border-radius: 8px;
772
+ }
773
+
774
+ .quikchat-theme-glass .quikchat-input-area {
775
+ background: rgba(255, 255, 255, 0.15);
776
+ border-top: 1px solid rgba(255, 255, 255, 0.15);
777
+ border-bottom-left-radius: 16px;
778
+ border-bottom-right-radius: 16px;
779
+ }
780
+
781
+ .quikchat-theme-glass .quikchat-input-textbox {
782
+ background: rgba(255, 255, 255, 0.3);
783
+ color: #1a1a2e;
784
+ border: 1px solid rgba(255, 255, 255, 0.3);
785
+ border-radius: 8px;
786
+ }
787
+
788
+ .quikchat-theme-glass .quikchat-input-textbox::placeholder {
789
+ color: rgba(26, 26, 46, 0.5);
790
+ }
791
+
792
+ .quikchat-theme-glass .quikchat-input-send-btn {
793
+ background: linear-gradient(135deg, #667eea, #764ba2);
794
+ color: white;
795
+ border: none;
796
+ border-radius: 8px;
797
+ font-weight: 600;
798
+ box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
799
+ }
800
+
801
+ .quikchat-theme-glass .quikchat-input-send-btn:hover {
802
+ background: linear-gradient(135deg, #5a6fd6, #6a4196);
803
+ }
804
+
805
+ /* ================================== */
806
+ /* Theme: gradient */
807
+ /* Purple-indigo gradient accents */
808
+ /* ================================== */
809
+
810
+ .quikchat-theme-gradient {
811
+ border: 1px solid #e0d4f5;
812
+ border-radius: 12px;
813
+ background-color: #ffffff;
814
+ box-shadow: 0 4px 20px rgba(100, 60, 180, 0.12);
815
+ }
816
+
817
+ .quikchat-theme-gradient .quikchat-title-area {
818
+ background: linear-gradient(135deg, #667eea, #764ba2);
819
+ color: #ffffff;
820
+ border-radius: 11px 11px 0 0;
821
+ }
822
+
823
+ .quikchat-theme-gradient .quikchat-messages-area {
824
+ background-color: #ffffff;
825
+ color: #2d2d3a;
826
+ }
827
+
828
+ .quikchat-theme-gradient .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
829
+ background-color: #ffffff;
830
+ color: #2d2d3a;
831
+ border-radius: 6px;
832
+ }
833
+
834
+ .quikchat-theme-gradient .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
835
+ background-color: #f3effc;
836
+ color: #2d2d3a;
837
+ border-radius: 6px;
838
+ }
839
+
840
+ .quikchat-theme-gradient .quikchat-input-area {
841
+ background-color: #faf8ff;
842
+ border-top: 1px solid #ece4f8;
843
+ border-bottom-left-radius: 12px;
844
+ border-bottom-right-radius: 12px;
845
+ }
846
+
847
+ .quikchat-theme-gradient .quikchat-input-textbox {
848
+ background-color: #ffffff;
849
+ color: #2d2d3a;
850
+ border: 1px solid #d4c4ea;
851
+ border-radius: 8px;
852
+ }
853
+
854
+ .quikchat-theme-gradient .quikchat-input-send-btn {
855
+ background: linear-gradient(135deg, #667eea, #764ba2);
856
+ color: white;
857
+ border: none;
858
+ border-radius: 8px;
859
+ font-weight: 600;
860
+ box-shadow: 0 2px 8px rgba(102, 126, 234, 0.25);
861
+ }
862
+
863
+ .quikchat-theme-gradient .quikchat-input-send-btn:hover {
864
+ background: linear-gradient(135deg, #5a6fd6, #6a4196);
865
+ }
866
+
867
+ /* ================================== */
868
+ /* Theme: minimal */
869
+ /* Ultra-clean, typography-focused */
870
+ /* ================================== */
871
+
872
+ .quikchat-theme-minimal {
873
+ border: 1px solid #e0e0e0;
874
+ border-radius: 8px;
875
+ background-color: #ffffff;
876
+ }
877
+
878
+ .quikchat-theme-minimal .quikchat-title-area {
879
+ background-color: #ffffff;
880
+ color: #111111;
881
+ border-bottom: 1px solid #e8e8e8;
882
+ font-weight: 700;
883
+ }
884
+
885
+ .quikchat-theme-minimal .quikchat-messages-area {
886
+ background-color: #ffffff;
887
+ color: #222222;
888
+ }
889
+
890
+ .quikchat-theme-minimal .quikchat-messages-area-alt .quikchat-message:nth-child(odd) {
891
+ background-color: #ffffff;
892
+ color: #222222;
893
+ border-radius: 4px;
894
+ }
895
+
896
+ .quikchat-theme-minimal .quikchat-messages-area-alt .quikchat-message:nth-child(even) {
897
+ background-color: #f8f8f8;
898
+ color: #222222;
899
+ border-radius: 4px;
900
+ }
901
+
902
+ .quikchat-theme-minimal .quikchat-input-area {
903
+ background-color: #ffffff;
904
+ border-top: 1px solid #e8e8e8;
905
+ border-bottom-left-radius: 8px;
906
+ border-bottom-right-radius: 8px;
907
+ }
908
+
909
+ .quikchat-theme-minimal .quikchat-input-textbox {
910
+ background-color: #ffffff;
911
+ color: #222222;
912
+ border: 1px solid #d0d0d0;
913
+ border-radius: 6px;
914
+ }
915
+
916
+ .quikchat-theme-minimal .quikchat-input-send-btn {
917
+ background-color: #111111;
918
+ color: white;
919
+ border: none;
920
+ border-radius: 6px;
921
+ font-weight: 600;
922
+ }
923
+
924
+ .quikchat-theme-minimal .quikchat-input-send-btn:hover {
925
+ background-color: #333333;
716
926
  }
717
927
 
718
928
  /* ================================== */
@@ -724,7 +934,10 @@
724
934
 
725
935
  .quikchat-theme-light .quikdown-pre,
726
936
  .quikchat-theme-blue .quikdown-pre,
727
- .quikchat-theme-warm .quikdown-pre {
937
+ .quikchat-theme-warm .quikdown-pre,
938
+ .quikchat-theme-glass .quikdown-pre,
939
+ .quikchat-theme-gradient .quikdown-pre,
940
+ .quikchat-theme-minimal .quikdown-pre {
728
941
  background: #f4f4f4;
729
942
  padding: 10px;
730
943
  border-radius: 4px;
@@ -734,7 +947,10 @@
734
947
 
735
948
  .quikchat-theme-light .quikdown-code,
736
949
  .quikchat-theme-blue .quikdown-code,
737
- .quikchat-theme-warm .quikdown-code {
950
+ .quikchat-theme-warm .quikdown-code,
951
+ .quikchat-theme-glass .quikdown-code,
952
+ .quikchat-theme-gradient .quikdown-code,
953
+ .quikchat-theme-minimal .quikdown-code {
738
954
  background: #f0f0f0;
739
955
  padding: 2px 4px;
740
956
  border-radius: 3px;
@@ -744,7 +960,10 @@
744
960
 
745
961
  .quikchat-theme-light .quikdown-blockquote,
746
962
  .quikchat-theme-blue .quikdown-blockquote,
747
- .quikchat-theme-warm .quikdown-blockquote {
963
+ .quikchat-theme-warm .quikdown-blockquote,
964
+ .quikchat-theme-glass .quikdown-blockquote,
965
+ .quikchat-theme-gradient .quikdown-blockquote,
966
+ .quikchat-theme-minimal .quikdown-blockquote {
748
967
  border-left: 4px solid #ddd;
749
968
  margin-left: 0;
750
969
  padding-left: 1em;
@@ -753,13 +972,19 @@
753
972
 
754
973
  .quikchat-theme-light .quikdown-a,
755
974
  .quikchat-theme-blue .quikdown-a,
756
- .quikchat-theme-warm .quikdown-a {
975
+ .quikchat-theme-warm .quikdown-a,
976
+ .quikchat-theme-glass .quikdown-a,
977
+ .quikchat-theme-gradient .quikdown-a,
978
+ .quikchat-theme-minimal .quikdown-a {
757
979
  color: #06c;
758
980
  }
759
981
 
760
982
  .quikchat-theme-light .quikdown-th,
761
983
  .quikchat-theme-blue .quikdown-th,
762
- .quikchat-theme-warm .quikdown-th {
984
+ .quikchat-theme-warm .quikdown-th,
985
+ .quikchat-theme-glass .quikdown-th,
986
+ .quikchat-theme-gradient .quikdown-th,
987
+ .quikchat-theme-minimal .quikdown-th {
763
988
  border: 1px solid #ddd;
764
989
  padding: 6px 8px;
765
990
  background-color: #f2f2f2;
@@ -769,7 +994,10 @@
769
994
 
770
995
  .quikchat-theme-light .quikdown-td,
771
996
  .quikchat-theme-blue .quikdown-td,
772
- .quikchat-theme-warm .quikdown-td {
997
+ .quikchat-theme-warm .quikdown-td,
998
+ .quikchat-theme-glass .quikdown-td,
999
+ .quikchat-theme-gradient .quikdown-td,
1000
+ .quikchat-theme-minimal .quikdown-td {
773
1001
  border: 1px solid #ddd;
774
1002
  padding: 6px 8px;
775
1003
  text-align: left;
@@ -777,7 +1005,10 @@
777
1005
 
778
1006
  .quikchat-theme-light .quikdown-hr,
779
1007
  .quikchat-theme-blue .quikdown-hr,
780
- .quikchat-theme-warm .quikdown-hr {
1008
+ .quikchat-theme-warm .quikdown-hr,
1009
+ .quikchat-theme-glass .quikdown-hr,
1010
+ .quikchat-theme-gradient .quikdown-hr,
1011
+ .quikchat-theme-minimal .quikdown-hr {
781
1012
  border: none;
782
1013
  border-top: 1px solid #ddd;
783
1014
  margin: 0.5em 0;