PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 2.2.0
MxChat – AI Chatbot & Content Generation for WordPress v2.2.0
3.2.21 3.2.20 3.2.19 3.2.18 3.2.17 3.2.16 3.2.15 3.2.14 3.2.12 3.2.13 3.2.11 3.2.10 3.2.9 3.2.8 3.2.7 3.2.6 3.2.5 3.2.4 3.2.3 3.2.2 3.2.1 2.0.3 2.0.4 2.0.5 2.0.6 All 152 releases
← All changes | css/admin-style.css +4 -2295 3.2.42.2.0 View file →
@@ -1,4 +1,4 @@
1 1 .wp-core-ui .notice.is-dismissible {
2 2 z-index: 10000;
3 3 }
4 4
@@ -262,23 +262,8 @@
262 262 }
263 263
264 264 /* Mobile Responsiveness */
265 265 @media screen and (max-width: 782px) {
266 - .mxchat-pro-notification ul {
267 - padding-left: 1.2em; /* Add left padding so bullets appear nicely */
268 - margin: 0.5em 0;
269 - text-align: left;
270 - list-style: disc; /* or 'none' if you don’t want bullets */
271 - }
272 -
273 - .mxchat-pro-notification ul li {
274 - text-align: left;
275 - margin-bottom: 0.3em;
276 - }
277 -
278 - .mxchat-pro-content p {
279 - text-align: left;
280 - }
281 266 .mxchat-knowledge-controls {
282 267 flex-direction: column;
283 268 }
284 269
@@ -2843,9 +2828,9 @@
2843 2828
2844 2829 .video-tutorials-section {
2845 2830 max-width: 1200px;
2846 2831 margin: 0 auto;
2847 - padding: 0;
2832 + padding: 2rem 0;
2848 2833 }
2849 2834
2850 2835 .section-intro {
2851 2836 text-align: center;
@@ -3227,38 +3212,10 @@
3227 3212 border-radius: 5px;
3228 3213 border-left: 4px solid #2271b1;
3229 3214 background-color: #f0f6fc;
3230 3215 transition: all 0.3s ease;
3231 - position: relative;
3232 3216 }
3233 3217
3234 -/* API Key save indicator positioning */
3235 -.api-key-wrapper .feedback-container {
3236 - position: relative;
3237 - display: inline-flex;
3238 - vertical-align: middle;
3239 - margin-left: 10px;
3240 - right: auto;
3241 - top: auto;
3242 - transform: none;
3243 -}
3244 -
3245 -/* Generic field wrapper for save indicator positioning */
3246 -.mxchat-field-wrapper {
3247 - position: relative;
3248 - display: inline-block;
3249 -}
3250 -
3251 -.mxchat-field-wrapper .feedback-container {
3252 - position: relative;
3253 - display: inline-flex;
3254 - vertical-align: middle;
3255 - margin-left: 10px;
3256 - right: auto;
3257 - top: auto;
3258 - transform: none;
3259 -}
3260 -
3261 3218 /* Row-level visibility handling */
3262 3219 tr.mxchat-setting-row {
3263 3220 display: table-row;
3264 3221 transition: all 0.3s ease;
@@ -3382,31 +3339,8 @@
3382 3339 border-color: #FF8C00;
3383 3340 box-shadow: 0 4px 12px rgba(255, 140, 0, 0.1);
3384 3341 }
3385 3342
3386 -.mxchat-action-type-card.mxchat-promo-card {
3387 - cursor: default;
3388 - opacity: 0.7;
3389 - border-style: dashed;
3390 - background: rgba(255, 255, 255, 0.6);
3391 -}
3392 -
3393 -.mxchat-action-type-card.mxchat-promo-card:hover {
3394 - cursor: pointer;
3395 - opacity: 0.9;
3396 - border-color: #FF8C00;
3397 -}
3398 -
3399 -.mxchat-addon-info a {
3400 - color: #FF8C00;
3401 - text-decoration: none;
3402 - font-weight: 600;
3403 -}
3404 -
3405 -.mxchat-addon-info a:hover {
3406 - text-decoration: underline;
3407 -}
3408 -
3409 3343 /* Add-on Notice */
3410 3344 .mxchat-addon-notice {
3411 3345 position: fixed;
3412 3346 top: 0;
@@ -3707,10 +3641,9 @@
3707 3641 grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
3708 3642 gap: 16px;
3709 3643 }
3710 3644
3711 -.mxchat-model-selector-modal .mxchat-model-selector-card,
3712 -.mxchat-model-selector-modal .mxchat-openrouter-card {
3645 +.mxchat-model-selector-modal .mxchat-model-selector-card {
3713 3646 display: flex;
3714 3647 border: 1px solid #ddd;
3715 3648 border-radius: 8px;
3716 3649 padding: 16px;
@@ -3718,16 +3651,14 @@
3718 3651 transition: all 0.2s;
3719 3652 position: relative;
3720 3653 }
3721 3654
3722 -.mxchat-model-selector-modal .mxchat-model-selector-card:hover,
3723 -.mxchat-model-selector-modal .mxchat-openrouter-card:hover {
3655 +.mxchat-model-selector-modal .mxchat-model-selector-card:hover {
3724 3656 border-color: #6750A4;
3725 3657 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
3726 3658 }
3727 3659
3728 -.mxchat-model-selector-modal .mxchat-model-selector-card.mxchat-model-selected,
3729 -.mxchat-model-selector-modal .mxchat-openrouter-card.mxchat-model-selected {
3660 +.mxchat-model-selector-modal .mxchat-model-selector-card.mxchat-model-selected {
3730 3661 border-color: #6750A4;
3731 3662 background-color: rgba(103, 80, 164, 0.05);
3732 3663 }
3733 3664
@@ -4043,18 +3974,8 @@
4043 3974 .mxchat-embedding-model-provider-voyage {
4044 3975 border-left: 4px solid #0055D4;
4045 3976 }
4046 3977
4047 -/* Provider-specific border color for Gemini */
4048 -.mxchat-embedding-model-provider-gemini {
4049 - border-left: 4px solid #4285F4;
4050 -}
4051 -
4052 -/* Icon color for Gemini */
4053 -.mxchat-embedding-model-icon-gemini {
4054 - color: #4285F4;
4055 -}
4056 -
4057 3978 .mxchat-embedding-model-selector-icon {
4058 3979 margin-right: 12px;
4059 3980 font-size: 24px;
4060 3981 display: flex;
@@ -4352,2216 +4273,4 @@
4352 4273 .mxchat-rate-limit-controls select {
4353 4274 width: 100%;
4354 4275 }
4355 4276 }
4356 -
4357 - /* Support notification styles */
4358 - .support-notification {
4359 - background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
4360 - border: 2px solid #f39c12;
4361 - border-radius: 12px;
4362 - padding: 20px;
4363 - margin-bottom: 25px;
4364 - display: flex;
4365 - align-items: flex-start;
4366 - gap: 15px;
4367 - box-shadow: 0 4px 12px rgba(243, 156, 18, 0.15);
4368 - position: relative;
4369 - overflow: hidden;
4370 - }
4371 -
4372 - .support-notification::before {
4373 - content: '';
4374 - position: absolute;
4375 - top: 0;
4376 - left: 0;
4377 - right: 0;
4378 - height: 4px;
4379 - background: linear-gradient(90deg, #f39c12, #e67e22, #f39c12);
4380 - background-size: 200% 100%;
4381 - animation: shimmer 2s ease-in-out infinite;
4382 - }
4383 -
4384 - @keyframes shimmer {
4385 - 0% { background-position: -200% 0; }
4386 - 100% { background-position: 200% 0; }
4387 - }
4388 -
4389 - .support-notification-icon {
4390 - flex-shrink: 0;
4391 - width: 24px;
4392 - height: 24px;
4393 - color: #e67e22;
4394 - margin-top: 2px;
4395 - }
4396 -
4397 - .support-notification-content {
4398 - flex: 1;
4399 - }
4400 -
4401 - .support-notification-title {
4402 - font-size: 18px;
4403 - font-weight: 600;
4404 - color: #8b4513;
4405 - margin: 0 0 8px 0;
4406 - display: flex;
4407 - align-items: center;
4408 - gap: 8px;
4409 - }
4410 -
4411 - .support-notification-message {
4412 - font-size: 15px;
4413 - color: #8b4513;
4414 - margin: 0 0 15px 0;
4415 - line-height: 1.5;
4416 - }
4417 -
4418 - .support-notification-button {
4419 - display: inline-flex;
4420 - align-items: center;
4421 - gap: 8px;
4422 - background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
4423 - color: white;
4424 - padding: 12px 20px;
4425 - border-radius: 8px;
4426 - text-decoration: none;
4427 - font-weight: 600;
4428 - font-size: 14px;
4429 - transition: all 0.3s ease;
4430 - border: none;
4431 - cursor: pointer;
4432 - box-shadow: 0 2px 8px rgba(230, 126, 34, 0.3);
4433 - }
4434 -
4435 - .support-notification-button:hover {
4436 - background: linear-gradient(135deg, #d35400 0%, #c0392b 100%);
4437 - transform: translateY(-2px);
4438 - box-shadow: 0 4px 12px rgba(230, 126, 34, 0.4);
4439 - color: white;
4440 - text-decoration: none;
4441 - }
4442 -
4443 - .support-notification-button:active {
4444 - transform: translateY(0);
4445 - }
4446 -
4447 - .support-notification-button svg {
4448 - width: 16px;
4449 - height: 16px;
4450 - }
4451 -
4452 - /* Responsive design */
4453 - @media (max-width: 768px) {
4454 - .support-notification {
4455 - padding: 16px;
4456 - gap: 12px;
4457 - }
4458 -
4459 - .support-notification-title {
4460 - font-size: 16px;
4461 - }
4462 -
4463 - .support-notification-message {
4464 - font-size: 14px;
4465 - }
4466 -
4467 - .support-notification-button {
4468 - padding: 10px 16px;
4469 - font-size: 13px;
4470 - }
4471 - }
4472 -/* Sample instructions button styles */
4473 -.mxchat-instructions-container {
4474 - margin-top: 8px;
4475 -}
4476 -
4477 -.mxchat-instructions-btn {
4478 - display: inline-flex;
4479 - align-items: center;
4480 - gap: 6px;
4481 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
4482 - color: white;
4483 - padding: 8px 14px;
4484 - border: none;
4485 - border-radius: 6px;
4486 - font-size: 13px;
4487 - font-weight: 500;
4488 - cursor: pointer;
4489 - transition: all 0.3s ease;
4490 - text-decoration: none;
4491 - box-shadow: 0 2px 4px rgba(102, 126, 234, 0.2);
4492 -}
4493 -
4494 -.mxchat-instructions-btn:hover {
4495 - background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%);
4496 - transform: translateY(-1px);
4497 - box-shadow: 0 4px 8px rgba(102, 126, 234, 0.3);
4498 -}
4499 -
4500 -.mxchat-instructions-btn:active {
4501 - transform: translateY(0);
4502 -}
4503 -
4504 -.mxchat-instructions-btn svg {
4505 - width: 14px;
4506 - height: 14px;
4507 -}
4508 -
4509 -/* Modal styles - Positioned relative to viewport */
4510 -.mxchat-instructions-modal-overlay {
4511 - display: none;
4512 - position: fixed;
4513 - top: 0;
4514 - left: 0;
4515 - width: 100%;
4516 - height: 100%;
4517 - background: rgba(0, 0, 0, 0.6);
4518 - z-index: 999999;
4519 -}
4520 -
4521 -.mxchat-instructions-modal-overlay.mxchat-instructions-show {
4522 - display: flex;
4523 - align-items: center;
4524 - justify-content: center;
4525 - padding: 20px;
4526 -}
4527 -
4528 -.mxchat-instructions-modal-content {
4529 - background: white;
4530 - border-radius: 12px;
4531 - max-width: 700px;
4532 - width: 100%;
4533 - max-height: 90vh;
4534 - overflow: hidden;
4535 - box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
4536 -}
4537 -
4538 -.mxchat-instructions-modal-header {
4539 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
4540 - color: white;
4541 - padding: 20px 24px;
4542 - display: flex;
4543 - align-items: center;
4544 - justify-content: space-between;
4545 -}
4546 -
4547 -.mxchat-instructions-modal-title {
4548 - font-size: 18px;
4549 - font-weight: 600;
4550 - margin: 0;
4551 - display: flex;
4552 - align-items: center;
4553 - gap: 10px;
4554 -}
4555 -
4556 -.mxchat-instructions-modal-close {
4557 - background: rgba(255, 255, 255, 0.2);
4558 - border: none;
4559 - color: white;
4560 - width: 32px;
4561 - height: 32px;
4562 - border-radius: 6px;
4563 - cursor: pointer;
4564 - display: flex;
4565 - align-items: center;
4566 - justify-content: center;
4567 - transition: background 0.2s ease;
4568 -}
4569 -
4570 -.mxchat-instructions-modal-close:hover {
4571 - background: rgba(255, 255, 255, 0.3);
4572 -}
4573 -
4574 -.mxchat-instructions-modal-body {
4575 - padding: 24px;
4576 - overflow-y: auto;
4577 - max-height: calc(90vh - 140px);
4578 -}
4579 -
4580 -.mxchat-instructions-content {
4581 - background: #f8fafc;
4582 - border: 2px solid #e2e8f0;
4583 - border-radius: 8px;
4584 - padding: 20px;
4585 - font-family: 'Courier New', Monaco, monospace;
4586 - font-size: 13px;
4587 - line-height: 1.6;
4588 - color: #2d3748;
4589 - white-space: pre-wrap;
4590 - word-wrap: break-word;
4591 -}
4592 -
4593 -.mxchat-instructions-copy-btn {
4594 - margin-top: 16px;
4595 - background: #48bb78;
4596 - color: white;
4597 - border: none;
4598 - padding: 10px 16px;
4599 - border-radius: 6px;
4600 - font-size: 14px;
4601 - font-weight: 500;
4602 - cursor: pointer;
4603 - display: inline-flex;
4604 - align-items: center;
4605 - gap: 8px;
4606 - transition: all 0.2s ease;
4607 -}
4608 -
4609 -.mxchat-instructions-copy-btn:hover {
4610 - background: #38a169;
4611 - transform: translateY(-1px);
4612 -}
4613 -
4614 -.mxchat-instructions-copy-btn svg {
4615 - width: 16px;
4616 - height: 16px;
4617 -}
4618 -
4619 -.mxchat-instructions-modal-footer {
4620 - padding: 16px 24px;
4621 - background: #f7fafc;
4622 - border-top: 1px solid #e2e8f0;
4623 - text-align: right;
4624 -}
4625 -
4626 -.mxchat-instructions-btn-secondary {
4627 - background: #e2e8f0;
4628 - color: #4a5568;
4629 - border: none;
4630 - padding: 8px 16px;
4631 - border-radius: 6px;
4632 - font-size: 14px;
4633 - cursor: pointer;
4634 - transition: background 0.2s ease;
4635 -}
4636 -
4637 -.mxchat-instructions-btn-secondary:hover {
4638 - background: #cbd5e0;
4639 -}
4640 -
4641 -/* Responsive design */
4642 -@media (max-width: 782px) {
4643 - .mxchat-instructions-modal-overlay.mxchat-instructions-show {
4644 - padding: 10px;
4645 - }
4646 -
4647 - .mxchat-instructions-modal-content {
4648 - max-height: 95vh;
4649 - }
4650 -
4651 - .mxchat-instructions-modal-header {
4652 - padding: 16px 20px;
4653 - }
4654 -
4655 - .mxchat-instructions-modal-body {
4656 - padding: 20px;
4657 - max-height: calc(95vh - 120px);
4658 - }
4659 -
4660 - .mxchat-instructions-content {
4661 - font-size: 12px;
4662 - padding: 16px;
4663 - }
4664 -}
4665 -
4666 -
4667 -
4668 -
4669 -
4670 -/* Completion Card - Modern Theme */
4671 -.mxchat-completion-card {
4672 - margin: 20px 0;
4673 - background: #ffffff;
4674 - border-radius: 12px;
4675 - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), 0 4px 16px rgba(0, 0, 0, 0.06);
4676 - overflow: hidden;
4677 - transition: all 0.3s ease;
4678 - border: 1px solid rgba(0, 0, 0, 0.06);
4679 -}
4680 -
4681 -.mxchat-completion-card:hover {
4682 - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 6px 20px rgba(0, 0, 0, 0.08);
4683 -}
4684 -
4685 -/* Header Section */
4686 -.mxchat-completion-header {
4687 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
4688 - padding: 24px;
4689 - display: flex;
4690 - align-items: center;
4691 - gap: 16px;
4692 -}
4693 -
4694 -.mxchat-completion-icon {
4695 - width: 48px;
4696 - height: 48px;
4697 - background: rgba(255, 255, 255, 0.2);
4698 - border-radius: 12px;
4699 - display: flex;
4700 - align-items: center;
4701 - justify-content: center;
4702 - flex-shrink: 0;
4703 -}
4704 -
4705 -.mxchat-completion-icon svg {
4706 - color: #ffffff;
4707 - width: 28px;
4708 - height: 28px;
4709 -}
4710 -
4711 -.mxchat-completion-title h3 {
4712 - margin: 0;
4713 - color: #ffffff;
4714 - font-size: 20px;
4715 - font-weight: 600;
4716 - letter-spacing: -0.02em;
4717 -}
4718 -
4719 -.mxchat-completion-time {
4720 - margin: 4px 0 0 0;
4721 - color: rgba(255, 255, 255, 0.8);
4722 - font-size: 14px;
4723 -}
4724 -
4725 -/* Summary Section */
4726 -.mxchat-completion-summary {
4727 - padding: 24px;
4728 - border-bottom: 1px solid #f0f0f1;
4729 -}
4730 -
4731 -.mxchat-completion-summary h4 {
4732 - margin: 0 0 16px 0;
4733 - color: #1d2327;
4734 - font-size: 16px;
4735 - font-weight: 600;
4736 -}
4737 -
4738 -.mxchat-summary-stats {
4739 - display: grid;
4740 - grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
4741 - gap: 12px;
4742 -}
4743 -
4744 -.mxchat-stat-card {
4745 - padding: 20px;
4746 - border-radius: 12px;
4747 - display: flex;
4748 - align-items: center;
4749 - gap: 16px;
4750 - transition: all 0.2s ease;
4751 -}
4752 -
4753 -.mxchat-stat-card:hover {
4754 - transform: translateY(-2px);
4755 - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
4756 -}
4757 -
4758 -.mxchat-stat-card .stat-icon {
4759 - font-size: 32px;
4760 - line-height: 1;
4761 - opacity: 0.9;
4762 -}
4763 -
4764 -.mxchat-stat-card .stat-content {
4765 - flex: 1;
4766 - text-align: left;
4767 -}
4768 -
4769 -.mxchat-stat-label {
4770 - display: block;
4771 - font-size: 12px;
4772 - color: #646970;
4773 - font-weight: 500;
4774 - text-transform: uppercase;
4775 - letter-spacing: 0.5px;
4776 - margin-bottom: 4px;
4777 -}
4778 -
4779 -.mxchat-stat-value {
4780 - display: block;
4781 - font-size: 28px;
4782 - font-weight: 700;
4783 - color: #1d2327;
4784 - line-height: 1.2;
4785 -}
4786 -
4787 -.mxchat-stat-sublabel {
4788 - display: block;
4789 - font-size: 11px;
4790 - color: #8c8f94;
4791 - margin-top: 4px;
4792 -}
4793 -
4794 -/* Stat Card Variants */
4795 -.mxchat-stat-primary {
4796 - background: linear-gradient(135deg, #f6f7f7 0%, #ffffff 100%);
4797 - border: 1px solid #e5e7eb;
4798 -}
4799 -
4800 -.mxchat-stat-accent {
4801 - border: 1px solid #e9d5ff;
4802 -}
4803 -
4804 -.mxchat-stat-accent .stat-value {
4805 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
4806 - -webkit-background-clip: text;
4807 - -webkit-text-fill-color: transparent;
4808 - background-clip: text;
4809 -}
4810 -
4811 -.mxchat-stat-success {
4812 - background: #e6f5e6;
4813 -}
4814 -
4815 -.mxchat-stat-success .mxchat-stat-value {
4816 - color: #00a32a;
4817 -}
4818 -
4819 -.mxchat-stat-failed {
4820 - background: #fef1f1;
4821 -}
4822 -
4823 -.mxchat-stat-failed .mxchat-stat-value {
4824 - color: #d63638;
4825 -}
4826 -
4827 -/* Metrics Dashboard */
4828 -.mxchat-metrics-dashboard {
4829 - background: #ffffff;
4830 - border-radius: 16px;
4831 - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
4832 - margin-bottom: 24px;
4833 - overflow: hidden;
4834 -}
4835 -
4836 -.mxchat-metrics-tabs {
4837 - display: flex;
4838 - gap: 0;
4839 - background: #f6f7f7;
4840 - border-bottom: 1px solid #e5e7eb;
4841 - padding: 0;
4842 -}
4843 -
4844 -.mxchat-metrics-tab {
4845 - flex: 1;
4846 - display: flex;
4847 - align-items: center;
4848 - justify-content: center;
4849 - gap: 8px;
4850 - padding: 16px 24px;
4851 - background: transparent;
4852 - border: none;
4853 - border-bottom: 3px solid transparent;
4854 - cursor: pointer;
4855 - font-size: 14px;
4856 - font-weight: 500;
4857 - color: #646970;
4858 - transition: all 0.2s ease;
4859 - position: relative;
4860 -}
4861 -
4862 -.mxchat-metrics-tab:hover {
4863 - background: rgba(255, 255, 255, 0.5);
4864 - color: #1d2327;
4865 -}
4866 -
4867 -.mxchat-metrics-tab.active {
4868 - background: #ffffff;
4869 - color: #1d2327;
4870 - border-bottom-color: #667eea;
4871 -}
4872 -
4873 -.mxchat-metrics-tab .tab-icon {
4874 - font-size: 18px;
4875 - line-height: 1;
4876 -}
4877 -
4878 -.mxchat-metrics-tab .tab-label {
4879 - font-weight: 600;
4880 -}
4881 -
4882 -.mxchat-metrics-content {
4883 - position: relative;
4884 -}
4885 -
4886 -.mxchat-metrics-panel {
4887 - display: none;
4888 - padding: 24px;
4889 - animation: mxchat-fadeIn 0.3s ease;
4890 -}
4891 -
4892 -.mxchat-metrics-panel.active {
4893 - display: block;
4894 -}
4895 -
4896 -@keyframes mxchat-fadeIn {
4897 - from {
4898 - opacity: 0;
4899 - transform: translateY(10px);
4900 - }
4901 - to {
4902 - opacity: 1;
4903 - transform: translateY(0);
4904 - }
4905 -}
4906 -
4907 -/* Activity Layout */
4908 -.mxchat-activity-layout {
4909 - display: grid;
4910 - gap: 24px;
4911 -}
4912 -
4913 -.mxchat-activity-stats {
4914 - display: grid;
4915 - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
4916 - gap: 16px;
4917 -}
4918 -
4919 -/* Chart Container */
4920 -.mxchat-chart-container {
4921 - background: #f9fafb;
4922 - border-radius: 12px;
4923 - padding: 24px;
4924 - border: 1px solid #e5e7eb;
4925 -}
4926 -
4927 -.mxchat-chart-title {
4928 - margin: 0 0 20px 0;
4929 - font-size: 16px;
4930 - font-weight: 600;
4931 - color: #1d2327;
4932 - display: flex;
4933 - align-items: center;
4934 - gap: 8px;
4935 -}
4936 -
4937 -#mxchat-activity-chart {
4938 - max-height: 300px;
4939 - width: 100% !important;
4940 - height: auto !important;
4941 -}
4942 -
4943 -/* Insights Grid */
4944 -.mxchat-insights-grid {
4945 - display: grid;
4946 - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
4947 - gap: 20px;
4948 -}
4949 -
4950 -.mxchat-insight-card {
4951 - background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%);
4952 - border: 1px solid #e5e7eb;
4953 - border-radius: 12px;
4954 - padding: 20px;
4955 - transition: all 0.2s ease;
4956 -}
4957 -
4958 -.mxchat-insight-card:hover {
4959 - transform: translateY(-2px);
4960 - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
4961 - border-color: #d1d5db;
4962 -}
4963 -
4964 -.insight-header {
4965 - display: flex;
4966 - align-items: center;
4967 - gap: 12px;
4968 - margin-bottom: 16px;
4969 - padding-bottom: 12px;
4970 - border-bottom: 1px solid #e5e7eb;
4971 -}
4972 -
4973 -.insight-icon {
4974 - font-size: 24px;
4975 - line-height: 1;
4976 -}
4977 -
4978 -.insight-header h3 {
4979 - margin: 0;
4980 - font-size: 14px;
4981 - font-weight: 600;
4982 - color: #374151;
4983 - text-transform: uppercase;
4984 - letter-spacing: 0.5px;
4985 -}
4986 -
4987 -.insight-content {
4988 - text-align: left;
4989 -}
4990 -
4991 -.insight-value {
4992 - font-size: 32px;
4993 - font-weight: 700;
4994 - color: #1d2327;
4995 - margin-bottom: 8px;
4996 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
4997 - -webkit-background-clip: text;
4998 - -webkit-text-fill-color: transparent;
4999 - background-clip: text;
5000 - padding-bottom: 4px; /* Prevent gradient text clipping */
5001 -}
5002 -
5003 -.insight-description {
5004 - font-size: 12px;
5005 - color: #374151;
5006 - line-height: 1.5;
5007 -}
5008 -
5009 -.insight-breakdown {
5010 - display: flex;
5011 - flex-direction: column;
5012 - gap: 12px;
5013 -}
5014 -
5015 -.breakdown-item {
5016 - display: flex;
5017 - justify-content: space-between;
5018 - align-items: center;
5019 - padding: 10px 12px;
5020 - background: #f9fafb;
5021 - border-radius: 6px;
5022 - border: 1px solid #e5e7eb;
5023 -}
5024 -
5025 -.breakdown-label {
5026 - font-size: 13px;
5027 - color: #6b7280;
5028 - font-weight: 500;
5029 -}
5030 -
5031 -.breakdown-value {
5032 - font-size: 16px;
5033 - font-weight: 700;
5034 - color: #1d2327;
5035 -}
5036 -
5037 -/* Status Badges */
5038 -.insight-status {
5039 - display: flex;
5040 - align-items: center;
5041 -}
5042 -
5043 -/* Reset gradient text styling for status badges */
5044 -.insight-value.insight-status {
5045 - background: none;
5046 - -webkit-background-clip: unset;
5047 - -webkit-text-fill-color: unset;
5048 - background-clip: unset;
5049 -}
5050 -
5051 -.status-badge {
5052 - display: inline-block;
5053 - padding: 6px 12px;
5054 - border-radius: 20px;
5055 - font-size: 13px;
5056 - font-weight: 600;
5057 - text-transform: uppercase;
5058 - letter-spacing: 0.5px;
5059 -}
5060 -
5061 -.status-active {
5062 - background: linear-gradient(135deg, #10b981 0%, #059669 100%);
5063 - color: #ffffff !important;
5064 - -webkit-text-fill-color: #ffffff !important;
5065 -}
5066 -
5067 -.status-moderate {
5068 - background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
5069 - color: #ffffff !important;
5070 - -webkit-text-fill-color: #ffffff !important;
5071 -}
5072 -
5073 -.status-quiet {
5074 - background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
5075 - color: #ffffff !important;
5076 - -webkit-text-fill-color: #ffffff !important;
5077 -}
5078 -
5079 -/* Responsive Design */
5080 -@media (max-width: 768px) {
5081 - .mxchat-metrics-tabs {
5082 - flex-direction: column;
5083 - }
5084 -
5085 - .mxchat-metrics-tab {
5086 - border-bottom: none;
5087 - border-left: 3px solid transparent;
5088 - }
5089 -
5090 - .mxchat-metrics-tab.active {
5091 - border-bottom: none;
5092 - border-left-color: #667eea;
5093 - }
5094 -
5095 - .mxchat-activity-stats,
5096 - .mxchat-insights-grid {
5097 - grid-template-columns: 1fr;
5098 - }
5099 -
5100 - .mxchat-stats-grid {
5101 - grid-template-columns: 1fr;
5102 - }
5103 -}
5104 -
5105 -/* Failed URLs Section */
5106 -.mxchat-failed-urls-section {
5107 - padding: 24px;
5108 - background: #fafafa;
5109 - border-top: 1px solid #f0f0f1;
5110 -}
5111 -
5112 -.mxchat-failed-urls-section h4 {
5113 - margin: 0 0 16px 0;
5114 - color: #d63638;
5115 - font-size: 16px;
5116 - font-weight: 600;
5117 - display: flex;
5118 - align-items: center;
5119 - gap: 8px;
5120 -}
5121 -
5122 -.mxchat-icon-warning {
5123 - flex-shrink: 0;
5124 -}
5125 -
5126 -.mxchat-failed-urls-table-wrapper {
5127 - max-height: 300px;
5128 - overflow-y: auto;
5129 - background: #ffffff;
5130 - border-radius: 8px;
5131 - border: 1px solid #e0e0e0;
5132 -}
5133 -
5134 -.mxchat-failed-urls-table {
5135 - width: 100%;
5136 - border-collapse: collapse;
5137 -}
5138 -
5139 -.mxchat-failed-urls-table thead {
5140 - position: sticky;
5141 - top: 0;
5142 - background: #f6f7f7;
5143 - z-index: 1;
5144 -}
5145 -
5146 -.mxchat-failed-urls-table th {
5147 - text-align: left;
5148 - padding: 12px 16px;
5149 - font-weight: 600;
5150 - font-size: 13px;
5151 - color: #1d2327;
5152 - text-transform: uppercase;
5153 - letter-spacing: 0.5px;
5154 - border-bottom: 2px solid #e0e0e0;
5155 -}
5156 -
5157 -.mxchat-failed-urls-table tbody tr {
5158 - transition: background-color 0.2s ease;
5159 -}
5160 -
5161 -.mxchat-failed-urls-table tbody tr:hover {
5162 - background-color: #f6f7f7;
5163 -}
5164 -
5165 -.mxchat-failed-urls-table td {
5166 - padding: 12px 16px;
5167 - border-bottom: 1px solid #f0f0f1;
5168 - font-size: 14px;
5169 -}
5170 -
5171 -.mxchat-url-cell {
5172 - word-break: break-all;
5173 -}
5174 -
5175 -.mxchat-url-cell a {
5176 - color: #667eea;
5177 - text-decoration: none;
5178 - transition: color 0.2s ease;
5179 -}
5180 -
5181 -.mxchat-url-cell a:hover {
5182 - color: #764ba2;
5183 - text-decoration: underline;
5184 -}
5185 -
5186 -.mxchat-error-cell {
5187 - color: #d63638;
5188 -}
5189 -
5190 -.mxchat-time-cell {
5191 - color: #646970;
5192 - white-space: nowrap;
5193 -}
5194 -
5195 -/* Action Buttons */
5196 -.mxchat-completion-actions {
5197 - padding: 24px;
5198 - display: flex;
5199 - gap: 12px;
5200 - justify-content: flex-end;
5201 - background: #fafafa;
5202 -}
5203 -
5204 -.mxchat-btn {
5205 - display: inline-flex;
5206 - align-items: center;
5207 - gap: 8px;
5208 - padding: 10px 20px;
5209 - border: none;
5210 - border-radius: 6px;
5211 - font-size: 14px;
5212 - font-weight: 500;
5213 - cursor: pointer;
5214 - transition: all 0.2s ease;
5215 - text-decoration: none;
5216 -}
5217 -
5218 -.mxchat-btn svg {
5219 - width: 16px;
5220 - height: 16px;
5221 -}
5222 -
5223 -.mxchat-btn-primary {
5224 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
5225 - color: #ffffff;
5226 -}
5227 -
5228 -.mxchat-btn-primary:hover {
5229 - transform: translateY(-1px);
5230 - box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
5231 -}
5232 -
5233 -.mxchat-btn-secondary {
5234 - background: #ffffff;
5235 - color: #667eea;
5236 - border: 1px solid #667eea;
5237 -}
5238 -
5239 -.mxchat-btn-secondary:hover {
5240 - background: #f6f7ff;
5241 - transform: translateY(-1px);
5242 - box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2);
5243 -}
5244 -
5245 -.mxchat-btn:disabled {
5246 - opacity: 0.5;
5247 - cursor: not-allowed;
5248 -}
5249 -
5250 -.mxchat-btn:disabled:hover {
5251 - transform: none;
5252 - box-shadow: none;
5253 -}
5254 -
5255 -/* Responsive adjustments */
5256 -@media (max-width: 768px) {
5257 - .mxchat-summary-stats {
5258 - grid-template-columns: 1fr;
5259 - }
5260 -
5261 - .mxchat-completion-actions {
5262 - flex-direction: column;
5263 - }
5264 -
5265 - .mxchat-btn {
5266 - width: 100%;
5267 - justify-content: center;
5268 - }
5269 -}
5270 -
5271 -/* Scrollbar styling for failed URLs table */
5272 -.mxchat-failed-urls-table-wrapper::-webkit-scrollbar {
5273 - width: 8px;
5274 -}
5275 -
5276 -.mxchat-failed-urls-table-wrapper::-webkit-scrollbar-track {
5277 - background: #f0f0f1;
5278 - border-radius: 4px;
5279 -}
5280 -
5281 -.mxchat-failed-urls-table-wrapper::-webkit-scrollbar-thumb {
5282 - background: #c3c4c7;
5283 - border-radius: 4px;
5284 -}
5285 -
5286 -.mxchat-failed-urls-table-wrapper::-webkit-scrollbar-thumb:hover {
5287 - background: #a7aaad;
5288 -}
5289 -
5290 -
5291 -/* Live Agent Disabled Notice Styles - Enhanced design */
5292 -.mxchat-live-agent-disabled-notice {
5293 - margin-bottom: 20px;
5294 -}
5295 -
5296 -.mxchat-live-agent-disabled-notice .mxchat-pro-notification {
5297 - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
5298 - border-radius: 12px;
5299 - padding: 24px 24px 24px 24px;
5300 - color: white;
5301 - position: relative;
5302 - box-shadow: 0 8px 32px rgba(102, 126, 234, 0.3);
5303 - border: 1px solid rgba(255, 255, 255, 0.1);
5304 -}
5305 -
5306 -.mxchat-dismiss-btn {
5307 - position: absolute;
5308 - top: 16px;
5309 - right: 16px;
5310 - background: rgba(255, 255, 255, 0.1);
5311 - border: 1px solid rgba(255, 255, 255, 0.2);
5312 - border-radius: 6px;
5313 - color: rgba(255, 255, 255, 0.8);
5314 - cursor: pointer;
5315 - padding: 8px;
5316 - display: flex;
5317 - align-items: center;
5318 - justify-content: center;
5319 - transition: all 0.2s ease;
5320 - backdrop-filter: blur(10px);
5321 -}
5322 -
5323 -.mxchat-dismiss-btn:hover {
5324 - background: rgba(255, 255, 255, 0.2);
5325 - color: white;
5326 - transform: scale(1.05);
5327 -}
5328 -
5329 -.mxchat-dismiss-btn:active {
5330 - transform: scale(0.95);
5331 -}
5332 -
5333 -.mxchat-live-agent-content {
5334 - padding-right: 60px; /* Space for dismiss button */
5335 -}
5336 -
5337 -.mxchat-live-agent-content h3 {
5338 - margin: 0 0 16px 0;
5339 - font-size: 20px;
5340 - font-weight: 600;
5341 - color: white;
5342 - display: flex;
5343 - align-items: center;
5344 - gap: 8px;
5345 -}
5346 -
5347 -.mxchat-live-agent-content p {
5348 - margin: 0;
5349 - font-size: 15px;
5350 - line-height: 1.6;
5351 - opacity: 0.95;
5352 - color: rgba(255, 255, 255, 0.95);
5353 -}
5354 -
5355 -.mxchat-live-agent-content strong {
5356 - color: #fff;
5357 - font-weight: 600;
5358 - background: rgba(255, 255, 255, 0.1);
5359 - padding: 2px 6px;
5360 - border-radius: 4px;
5361 - font-size: 14px;
5362 -}
5363 -
5364 -/* Theme Migration Notice Styles */
5365 -.mxchat-theme-migration-notice {
5366 - margin-bottom: 20px;
5367 -}
5368 -
5369 -.mxchat-theme-migration-notice .mxchat-pro-notification {
5370 - background: linear-gradient(135deg, #f472b6 0%, #a855f7 50%, #6366f1 100%);
5371 - border-radius: 12px;
5372 - padding: 24px 24px 24px 24px;
5373 - color: white;
5374 - position: relative;
5375 - box-shadow: 0 8px 32px rgba(244, 114, 182, 0.3);
5376 - border: 1px solid rgba(255, 255, 255, 0.1);
5377 -}
5378 -
5379 -.mxchat-theme-migration-content {
5380 - padding-right: 60px; /* Space for dismiss button */
5381 -}
5382 -
5383 -.mxchat-theme-migration-content h3 {
5384 - margin: 0 0 16px 0;
5385 - font-size: 20px;
5386 - font-weight: 600;
5387 - color: white;
5388 - display: flex;
5389 - align-items: center;
5390 - gap: 8px;
5391 -}
5392 -
5393 -.mxchat-theme-migration-content p {
5394 - margin: 0;
5395 - font-size: 15px;
5396 - line-height: 1.6;
5397 - opacity: 0.95;
5398 - color: rgba(255, 255, 255, 0.95);
5399 -}
5400 -
5401 -.mxchat-theme-migration-content strong {
5402 - color: #fff;
5403 - font-weight: 600;
5404 - background: rgba(255, 255, 255, 0.15);
5405 - padding: 2px 8px;
5406 - border-radius: 4px;
5407 - font-size: 14px;
5408 -}
5409 -
5410 -.mxchat-processing-controls {
5411 - display: flex;
5412 - gap: 10px;
5413 - align-items: center;
5414 -}
5415 -
5416 -/* Status Card Container */
5417 -.mxchat-status-card {
5418 - background: #fff;
5419 - border: 1px solid #ddd;
5420 - border-radius: 8px;
5421 - padding: 20px;
5422 - margin-bottom: 20px;
5423 - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
5424 - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
5425 -}
5426 -
5427 -/* Status Header */
5428 -.mxchat-status-header {
5429 - display: flex;
5430 - align-items: center;
5431 - justify-content: space-between;
5432 - margin-bottom: 15px;
5433 - flex-wrap: wrap;
5434 - gap: 10px;
5435 -}
5436 -
5437 -.mxchat-status-header h4 {
5438 - margin: 0;
5439 - font-size: 18px;
5440 - font-weight: 600;
5441 - color: #333;
5442 -}
5443 -
5444 -.mxchat-status-header h5 {
5445 - margin: 0 0 10px 0;
5446 - font-size: 16px;
5447 - font-weight: 600;
5448 - color: #333;
5449 -}
5450 -
5451 -/* Dismiss Button */
5452 -.mxchat-dismiss-button {
5453 - padding: 6px 12px;
5454 - background: #dc3545;
5455 - color: white;
5456 - border: none;
5457 - border-radius: 4px;
5458 - cursor: pointer;
5459 - font-size: 12px;
5460 - font-weight: 500;
5461 - transition: background-color 0.2s ease;
5462 -}
5463 -
5464 -.mxchat-dismiss-button:hover {
5465 - background: #c82333;
5466 -}
5467 -
5468 -.mxchat-dismiss-button:active {
5469 - transform: translateY(1px);
5470 -}
5471 -
5472 -/* Process Batch Button */
5473 -.mxchat-manual-batch-btn {
5474 - padding: 8px 16px;
5475 - background: #007cba;
5476 - color: white;
5477 - border: none;
5478 - border-radius: 4px;
5479 - cursor: pointer;
5480 - font-size: 13px;
5481 - font-weight: 500;
5482 - transition: all 0.2s ease;
5483 - text-decoration: none;
5484 - display: inline-block;
5485 -}
5486 -
5487 -.mxchat-manual-batch-btn:hover {
5488 - background: #005a87;
5489 - color: white;
5490 - text-decoration: none;
5491 -}
5492 -
5493 -.mxchat-manual-batch-btn:active {
5494 - transform: translateY(1px);
5495 -}
5496 -
5497 -.mxchat-manual-batch-btn:focus {
5498 - outline: 2px solid #007cba;
5499 - outline-offset: 2px;
5500 -}
5501 -
5502 -
5503 -
5504 -
5505 -
5506 -/* MxChat Plugin Activation Page Styles */
5507 -
5508 -.mxchat-license-details {
5509 - background: #f9f9f9;
5510 - padding: 15px;
5511 - border-radius: 5px;
5512 - margin-top: 15px;
5513 - border-left: 4px solid #2271b1;
5514 -}
5515 -
5516 -.mxchat-license-details p {
5517 - margin: 8px 0;
5518 -}
5519 -
5520 -.mxchat-license-details small {
5521 - color: #666;
5522 -}
5523 -
5524 -.mxchat-license-details a {
5525 - color: #2271b1;
5526 - text-decoration: none;
5527 -}
5528 -
5529 -.mxchat-license-details a:hover {
5530 - text-decoration: underline;
5531 -}
5532 -
5533 -/* Domain linking styles */
5534 -#link-domain-button {
5535 - background: #2271b1;
5536 - color: white;
5537 - border: none;
5538 - padding: 8px 16px;
5539 - border-radius: 4px;
5540 - cursor: pointer;
5541 - font-size: 13px;
5542 -}
5543 -
5544 -#link-domain-button:hover {
5545 - background: #1a5a8a;
5546 -}
5547 -
5548 -#link-domain-button:disabled {
5549 - background: #ccc;
5550 - cursor: not-allowed;
5551 -}
5552 -
5553 -#domain-link-status {
5554 - font-size: 13px;
5555 - font-weight: 500;
5556 -}
5557 -
5558 -/* Status badges */
5559 -.mxchat-status-badge.active {
5560 - color: #2d8f47;
5561 - background: #d4edda;
5562 - padding: 4px 8px;
5563 - border-radius: 4px;
5564 - font-size: 12px;
5565 - font-weight: 600;
5566 -}
5567 -
5568 -.mxchat-status-badge.inactive {
5569 - color: #842029;
5570 - background: #f8d7da;
5571 - padding: 4px 8px;
5572 - border-radius: 4px;
5573 - font-size: 12px;
5574 - font-weight: 600;
5575 -}
5576 -
5577 -/* Notice styles for domain linking */
5578 -.notice.notice-info {
5579 - background: #e7f3ff;
5580 - border-left-color: #2271b1;
5581 - z-index: 100000000000000000;
5582 - position: relative;
5583 -}
5584 -
5585 -.notice.notice-success {
5586 - background: #d1eddb;
5587 - border-left-color: #2d8f47;
5588 -}
5589 -
5590 -/* Animation for status changes */
5591 -.license-status-updating {
5592 - opacity: 0.6;
5593 - transition: opacity 0.3s ease;
5594 -}
5595 -
5596 -/* Spinner for domain linking */
5597 -.domain-link-spinner {
5598 - display: inline-block;
5599 - width: 16px;
5600 - height: 16px;
5601 - border: 2px solid #f3f3f3;
5602 - border-top: 2px solid #2271b1;
5603 - border-radius: 50%;
5604 - animation: spin 1s linear infinite;
5605 - margin-left: 8px;
5606 -}
5607 -
5608 -@keyframes spin {
5609 - 0% { transform: rotate(0deg); }
5610 - 100% { transform: rotate(360deg); }
5611 -}
5612 -
5613 -
5614 -
5615 -.mxchat-pro-notification .old-price {
5616 - text-decoration: line-through;
5617 - color: #888;
5618 -}
5619 -.mxchat-pro-notification .new-price {
5620 - font-weight: bold;
5621 - color: #d9534f; /* red for urgency */
5622 -}
5623 -
5624 -
5625 -
5626 - #mxchat-test-streaming-btn:disabled {
5627 - opacity: 0.6;
5628 - cursor: not-allowed;
5629 - }
5630 - #mxchat-test-streaming-result {
5631 - padding: 8px 12px;
5632 - border-radius: 4px;
5633 - display: none;
5634 - }
5635 - #mxchat-test-streaming-result:not(:empty) {
5636 - display: block;
5637 - background: #f0f0f1;
5638 - border-left: 4px solid #72aee6;
5639 - }
5640 -
5641 -
5642 - /* Hide email-dependent fields by default */
5643 -tr:has(#email_blocker_header_content),
5644 -tr:has(#email_blocker_button_text),
5645 -tr:has(#enable_name_field),
5646 -tr:has(#name_field_placeholder) {
5647 - display: none;
5648 -}
5649 -
5650 -/* Show them when email block is enabled */
5651 -body.email-block-enabled tr:has(#email_blocker_header_content),
5652 -body.email-block-enabled tr:has(#email_blocker_button_text),
5653 -body.email-block-enabled tr:has(#enable_name_field),
5654 -body.email-block-enabled tr:has(#name_field_placeholder) {
5655 - display: table-row;
5656 -}
5657 -
5658 -/* Style for email-dependent fields */
5659 -.email-dependent-field {
5660 - background-color: #f8f9fa;
5661 - border-left: 4px solid #0073aa;
5662 - padding-left: 15px;
5663 - margin-left: 10px;
5664 -}
5665 -
5666 -.email-dependent-field td,
5667 -.email-dependent-field th {
5668 - background-color: #f8f9fa;
5669 -}
5670 -
5671 -
5672 -/* NEW: Role restriction styles */
5673 -.mxchat-role-restriction-container {
5674 - margin-bottom: 8px;
5675 -}
5676 -
5677 -.mxchat-role-select {
5678 - width: 100%;
5679 - max-width: 180px;
5680 - padding: 4px 8px;
5681 - border: 1px solid #ddd;
5682 - border-radius: 4px;
5683 - font-size: 12px;
5684 - background: white;
5685 -}
5686 -
5687 -.mxchat-role-select.updating {
5688 - opacity: 0.6;
5689 - pointer-events: none;
5690 -}
5691 -
5692 -.mxchat-role-select.updated {
5693 - border-color: #46b450;
5694 - box-shadow: 0 0 0 1px #46b450;
5695 -}
5696 -
5697 -.mxchat-action-buttons {
5698 - display: flex;
5699 - gap: 4px;
5700 - justify-content: center;
5701 -}
5702 -
5703 -.mxchat-actions-cell {
5704 - min-width: 200px;
5705 - text-align: center;
5706 -}
5707 -
5708 -
5709 -
5710 -.mxchat-bot-selector {
5711 - display: flex;
5712 - flex-direction: column;
5713 - gap: 8px;
5714 - max-height: 200px;
5715 - overflow-y: auto;
5716 - border: 1px solid #ddd;
5717 - padding: 12px;
5718 - border-radius: 4px;
5719 - background: #f9f9f9;
5720 -}
5721 -
5722 -.mxchat-bot-option {
5723 - display: flex;
5724 - align-items: center;
5725 -}
5726 -
5727 -.mxchat-checkbox-label {
5728 - display: flex;
5729 - align-items: center;
5730 - cursor: pointer;
5731 - font-size: 14px;
5732 - gap: 8px;
5733 -}
5734 -
5735 -.mxchat-checkbox-label input[type="checkbox"] {
5736 - margin: 0;
5737 -}
5738 -
5739 -.mxchat-checkmark {
5740 - display: inline-block;
5741 -}
5742 -
5743 -
5744 -.mxchat-card-bots {
5745 - margin-top: 12px;
5746 - padding-top: 12px;
5747 - border-top: 1px solid #e5e7eb;
5748 -}
5749 -
5750 -.mxchat-card-bots strong {
5751 - display: block;
5752 - margin-bottom: 6px;
5753 - color: #374151;
5754 - font-size: 13px;
5755 - font-weight: 600;
5756 -}
5757 -
5758 -.mxchat-bot-badges {
5759 - display: flex;
5760 - flex-wrap: wrap;
5761 - gap: 6px;
5762 -}
5763 -
5764 -.mxchat-bot-badge {
5765 - display: inline-flex;
5766 - align-items: center;
5767 - padding: 3px 8px;
5768 - background-color: #f3f4f6;
5769 - border: 1px solid #d1d5db;
5770 - border-radius: 12px;
5771 - font-size: 11px;
5772 - font-weight: 500;
5773 - color: #6b7280;
5774 - line-height: 1.2;
5775 - white-space: nowrap;
5776 -}
5777 -
5778 -.mxchat-bot-badge:first-child {
5779 - background-color: #dbeafe;
5780 - border-color: #93c5fd;
5781 - color: #1e40af;
5782 -}
5783 -
5784 -
5785 -/* Always show OpenRouter API key field */
5786 -tr.mxchat-setting-row[data-provider="openrouter"],
5787 -.mxchat-openrouter-wrapper {
5788 - display: table-row !important;
5789 -}
5790 -
5791 -/* ========== RAG Context Modal Styles ========== */
5792 -
5793 -/* Message header with role and sources link */
5794 -.mxchat-message .mxchat-message-header {
5795 - display: flex;
5796 - justify-content: space-between;
5797 - align-items: center;
5798 - margin-bottom: 6px;
5799 -}
5800 -
5801 -.mxchat-message .mxchat-role-label {
5802 - font-weight: 600;
5803 - font-size: 12px;
5804 - text-transform: uppercase;
5805 - letter-spacing: 0.02em;
5806 -}
5807 -
5808 -/* Sources link - clean, professional style */
5809 -.mxchat-rag-link {
5810 - font-size: 11px;
5811 - color: #64748b;
5812 - cursor: pointer;
5813 - transition: color 0.15s ease;
5814 - font-weight: 500;
5815 - letter-spacing: 0.01em;
5816 -}
5817 -
5818 -.mxchat-rag-link:hover {
5819 - color: #3b82f6;
5820 -}
5821 -
5822 -/* Transcript message content styling */
5823 -.mxchat-message-content a {
5824 - color: #3b82f6;
5825 - text-decoration: none;
5826 -}
5827 -
5828 -.mxchat-message-content a:hover {
5829 - text-decoration: underline;
5830 -}
5831 -
5832 -.mxchat-message-content code {
5833 - background: rgba(0, 0, 0, 0.06);
5834 - padding: 2px 5px;
5835 - border-radius: 3px;
5836 - font-family: ui-monospace, monospace;
5837 - font-size: 0.9em;
5838 -}
5839 -
5840 -.mxchat-message-content pre {
5841 - background: #1e293b;
5842 - color: #e2e8f0;
5843 - padding: 12px 16px;
5844 - border-radius: 6px;
5845 - overflow-x: auto;
5846 - margin: 8px 0;
5847 -}
5848 -
5849 -.mxchat-message-content pre code {
5850 - background: none;
5851 - padding: 0;
5852 - color: inherit;
5853 -}
5854 -
5855 -.mxchat-message-content strong {
5856 - font-weight: 600;
5857 -}
5858 -
5859 -.mxchat-message-content h1,
5860 -.mxchat-message-content h2,
5861 -.mxchat-message-content h3,
5862 -.mxchat-message-content h4,
5863 -.mxchat-message-content h5,
5864 -.mxchat-message-content h6 {
5865 - margin: 12px 0 8px 0;
5866 - font-weight: 600;
5867 - line-height: 1.3;
5868 -}
5869 -
5870 -.mxchat-message-content h1 { font-size: 1.4em; }
5871 -.mxchat-message-content h2 { font-size: 1.3em; }
5872 -.mxchat-message-content h3 { font-size: 1.2em; }
5873 -.mxchat-message-content h4 { font-size: 1.1em; }
5874 -.mxchat-message-content h5 { font-size: 1em; }
5875 -.mxchat-message-content h6 { font-size: 0.95em; }
5876 -
5877 -/* RAG Modal Overlay */
5878 -.mxchat-rag-modal-overlay {
5879 - position: fixed;
5880 - top: 0;
5881 - left: 0;
5882 - width: 100%;
5883 - height: 100%;
5884 - background-color: rgba(15, 23, 42, 0.4);
5885 - backdrop-filter: blur(4px);
5886 - -webkit-backdrop-filter: blur(4px);
5887 - z-index: 100000;
5888 - display: flex;
5889 - align-items: center;
5890 - justify-content: center;
5891 - padding: 24px;
5892 -}
5893 -
5894 -/* RAG Modal Content */
5895 -.mxchat-rag-modal-content {
5896 - background: #fff;
5897 - border-radius: 16px;
5898 - width: 100%;
5899 - max-width: 640px;
5900 - max-height: calc(100vh - 48px);
5901 - display: flex;
5902 - flex-direction: column;
5903 - box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
5904 - animation: mxchat-modal-appear 0.2s ease-out;
5905 - overflow: hidden;
5906 -}
5907 -
5908 -@keyframes mxchat-modal-appear {
5909 - from {
5910 - opacity: 0;
5911 - transform: scale(0.96) translateY(8px);
5912 - }
5913 - to {
5914 - opacity: 1;
5915 - transform: scale(1) translateY(0);
5916 - }
5917 -}
5918 -
5919 -/* RAG Modal Header */
5920 -.mxchat-rag-modal-header {
5921 - display: flex;
5922 - justify-content: space-between;
5923 - align-items: center;
5924 - padding: 20px 24px;
5925 - border-bottom: 1px solid #e2e8f0;
5926 - background: #fff;
5927 - flex-shrink: 0;
5928 -}
5929 -
5930 -.mxchat-rag-modal-header h2 {
5931 - margin: 0;
5932 - font-size: 1.125rem;
5933 - font-weight: 600;
5934 - color: #0f172a;
5935 - letter-spacing: -0.01em;
5936 -}
5937 -
5938 -.mxchat-rag-modal-close {
5939 - display: flex;
5940 - align-items: center;
5941 - justify-content: center;
5942 - width: 32px;
5943 - height: 32px;
5944 - background: transparent;
5945 - border: none;
5946 - color: #64748b;
5947 - font-size: 20px;
5948 - cursor: pointer;
5949 - border-radius: 8px;
5950 - transition: all 0.15s ease;
5951 - line-height: 1;
5952 -}
5953 -
5954 -.mxchat-rag-modal-close:hover {
5955 - background: #f1f5f9;
5956 - color: #0f172a;
5957 -}
5958 -
5959 -/* RAG Modal Body */
5960 -.mxchat-rag-modal-body {
5961 - padding: 24px;
5962 - overflow-y: auto;
5963 - flex: 1;
5964 -}
5965 -
5966 -/* Loading State */
5967 -.mxchat-rag-loading {
5968 - display: flex;
5969 - align-items: center;
5970 - justify-content: center;
5971 - gap: 12px;
5972 - padding: 48px 24px;
5973 - color: #64748b;
5974 - font-size: 0.875rem;
5975 -}
5976 -
5977 -.mxchat-rag-loading .spinner {
5978 - float: none;
5979 - margin: 0;
5980 -}
5981 -
5982 -/* Error State */
5983 -.mxchat-rag-error {
5984 - text-align: center;
5985 - padding: 48px 24px;
5986 - color: #dc2626;
5987 - font-size: 0.875rem;
5988 -}
5989 -
5990 -/* Summary Section */
5991 -.mxchat-rag-summary {
5992 - display: flex;
5993 - gap: 32px;
5994 - padding: 0;
5995 - margin-bottom: 28px;
5996 - background: transparent;
5997 - border: none;
5998 -}
5999 -
6000 -.mxchat-rag-summary-item {
6001 - display: flex;
6002 - flex-direction: column;
6003 - gap: 4px;
6004 -}
6005 -
6006 -.mxchat-rag-label {
6007 - color: #94a3b8;
6008 - font-size: 0.6875rem;
6009 - font-weight: 500;
6010 - text-transform: uppercase;
6011 - letter-spacing: 0.05em;
6012 -}
6013 -
6014 -.mxchat-rag-value {
6015 - font-weight: 600;
6016 - font-size: 0.9375rem;
6017 - color: #0f172a;
6018 -}
6019 -
6020 -/* Matches Section */
6021 -.mxchat-rag-matches h3 {
6022 - margin: 0 0 12px 0;
6023 - font-size: 0.6875rem;
6024 - color: #94a3b8;
6025 - font-weight: 600;
6026 - text-transform: uppercase;
6027 - letter-spacing: 0.05em;
6028 -}
6029 -
6030 -/* Match Card */
6031 -.mxchat-rag-match-card {
6032 - border: 1px solid #e2e8f0;
6033 - border-radius: 12px;
6034 - padding: 16px;
6035 - margin-bottom: 8px;
6036 - transition: border-color 0.15s ease, box-shadow 0.15s ease;
6037 - background: #fff;
6038 -}
6039 -
6040 -.mxchat-rag-match-card:hover {
6041 - border-color: #cbd5e1;
6042 - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
6043 -}
6044 -
6045 -.mxchat-rag-match-card:last-child {
6046 - margin-bottom: 0;
6047 -}
6048 -
6049 -/* Match card variants */
6050 -.mxchat-rag-match-used {
6051 - border-color: #86efac;
6052 - background: #fafff9;
6053 -}
6054 -
6055 -.mxchat-rag-match-used:hover {
6056 - border-color: #4ade80;
6057 -}
6058 -
6059 -.mxchat-rag-match-above {
6060 - border-color: #fde047;
6061 - background: #fffef5;
6062 -}
6063 -
6064 -.mxchat-rag-match-above:hover {
6065 - border-color: #facc15;
6066 -}
6067 -
6068 -.mxchat-rag-match-below {
6069 - opacity: 0.5;
6070 -}
6071 -
6072 -/* Match Header */
6073 -.mxchat-rag-match-header {
6074 - display: flex;
6075 - align-items: center;
6076 - gap: 12px;
6077 - margin-bottom: 10px;
6078 -}
6079 -
6080 -.mxchat-rag-match-rank {
6081 - background: #0f172a;
6082 - color: #fff;
6083 - font-size: 0.625rem;
6084 - font-weight: 600;
6085 - padding: 3px 6px;
6086 - border-radius: 4px;
6087 - letter-spacing: 0.02em;
6088 -}
6089 -
6090 -.mxchat-rag-match-score {
6091 - font-size: 1rem;
6092 - font-weight: 700;
6093 - color: #0f172a;
6094 - font-variant-numeric: tabular-nums;
6095 -}
6096 -
6097 -.mxchat-rag-match-status {
6098 - font-size: 0.625rem;
6099 - padding: 4px 8px;
6100 - border-radius: 6px;
6101 - font-weight: 600;
6102 - text-transform: uppercase;
6103 - letter-spacing: 0.03em;
6104 - margin-left: auto;
6105 -}
6106 -
6107 -.mxchat-rag-match-status.status-used {
6108 - background: #dcfce7;
6109 - color: #166534;
6110 -}
6111 -
6112 -.mxchat-rag-match-status.status-above {
6113 - background: #fef9c3;
6114 - color: #854d0e;
6115 -}
6116 -
6117 -.mxchat-rag-match-status.status-below {
6118 - background: #f1f5f9;
6119 - color: #64748b;
6120 -}
6121 -
6122 -/* Match Source */
6123 -.mxchat-rag-match-source {
6124 - margin-bottom: 8px;
6125 - font-size: 0.8125rem;
6126 - color: #475569;
6127 - word-break: break-word;
6128 -}
6129 -
6130 -.mxchat-rag-match-source a {
6131 - color: #2563eb;
6132 - text-decoration: none;
6133 -}
6134 -
6135 -.mxchat-rag-match-source a:hover {
6136 - text-decoration: underline;
6137 -}
6138 -
6139 -/* Match Preview */
6140 -.mxchat-rag-match-preview {
6141 - font-size: 0.8125rem;
6142 - color: #64748b;
6143 - background: #f8fafc;
6144 - padding: 12px 14px;
6145 - border-radius: 8px;
6146 - line-height: 1.6;
6147 - max-height: 72px;
6148 - overflow: hidden;
6149 -}
6150 -
6151 -/* Match Meta */
6152 -.mxchat-rag-match-meta {
6153 - margin-top: 10px;
6154 -}
6155 -
6156 -.mxchat-rag-role-badge {
6157 - display: inline-block;
6158 - font-size: 0.625rem;
6159 - padding: 3px 8px;
6160 - background: #f1f5f9;
6161 - color: #475569;
6162 - border-radius: 4px;
6163 - font-weight: 500;
6164 -}
6165 -
6166 -/* Matches Summary */
6167 -.mxchat-rag-matches-summary {
6168 - margin: 0 0 16px 0;
6169 - font-size: 0.875rem;
6170 - color: #334155;
6171 - font-weight: 500;
6172 -}
6173 -
6174 -/* Chunk Badge */
6175 -.mxchat-rag-chunk-badge {
6176 - display: inline-block;
6177 - padding: 3px 8px;
6178 - font-size: 0.6875rem;
6179 - font-weight: 600;
6180 - background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
6181 - color: #fff;
6182 - border-radius: 10px;
6183 - text-transform: uppercase;
6184 - letter-spacing: 0.02em;
6185 -}
6186 -
6187 -/* Chunk Toggle */
6188 -.mxchat-rag-chunk-toggle {
6189 - display: block;
6190 - padding: 10px 0;
6191 - font-size: 0.75rem;
6192 - font-weight: 600;
6193 - color: #6366f1;
6194 - cursor: pointer;
6195 - border-top: 1px solid #e2e8f0;
6196 - margin-top: 12px;
6197 - transition: color 0.15s ease;
6198 -}
6199 -
6200 -.mxchat-rag-chunk-toggle:hover {
6201 - color: #4f46e5;
6202 -}
6203 -
6204 -/* Chunk Details */
6205 -.mxchat-rag-chunk-details {
6206 - display: none;
6207 - padding: 8px 0 0 0;
6208 -}
6209 -
6210 -/* Chunk Row */
6211 -.mxchat-rag-chunk-row {
6212 - display: flex;
6213 - align-items: center;
6214 - padding: 8px 10px;
6215 - margin: 4px 0;
6216 - border-radius: 6px;
6217 - font-size: 0.8125rem;
6218 - gap: 10px;
6219 -}
6220 -
6221 -.mxchat-rag-chunk-row.chunk-used {
6222 - background: rgba(16, 185, 129, 0.1);
6223 -}
6224 -
6225 -.mxchat-rag-chunk-row.chunk-not-used {
6226 - background: rgba(100, 116, 139, 0.08);
6227 -}
6228 -
6229 -.mxchat-rag-chunk-icon {
6230 - font-size: 0.875rem;
6231 - width: 18px;
6232 - text-align: center;
6233 -}
6234 -
6235 -.chunk-used .mxchat-rag-chunk-icon {
6236 - color: #10b981;
6237 -}
6238 -
6239 -.chunk-not-used .mxchat-rag-chunk-icon {
6240 - color: #94a3b8;
6241 -}
6242 -
6243 -.mxchat-rag-chunk-num {
6244 - font-weight: 600;
6245 - color: #334155;
6246 - flex: 1;
6247 -}
6248 -
6249 -.mxchat-rag-chunk-score {
6250 - font-weight: 600;
6251 - color: #64748b;
6252 - font-variant-numeric: tabular-nums;
6253 -}
6254 -
6255 -/* No Matches */
6256 -.mxchat-rag-no-matches {
6257 - text-align: center;
6258 - padding: 48px 24px;
6259 - color: #64748b;
6260 - font-size: 0.875rem;
6261 -}
6262 -
6263 -/* Approved URLs Section */
6264 -.mxchat-rag-urls {
6265 - margin-top: 28px;
6266 - padding-top: 20px;
6267 - border-top: 1px solid #e2e8f0;
6268 -}
6269 -
6270 -.mxchat-rag-urls h3 {
6271 - margin: 0 0 12px 0;
6272 - font-size: 0.6875rem;
6273 - color: #94a3b8;
6274 - font-weight: 600;
6275 - text-transform: uppercase;
6276 - letter-spacing: 0.05em;
6277 -}
6278 -
6279 -.mxchat-rag-url-list {
6280 - margin: 0;
6281 - padding: 0;
6282 - list-style: none;
6283 -}
6284 -
6285 -.mxchat-rag-url-list li {
6286 - padding: 10px 14px;
6287 - background: #f8fafc;
6288 - border-radius: 8px;
6289 - margin-bottom: 6px;
6290 - font-size: 0.8125rem;
6291 - word-break: break-all;
6292 -}
6293 -
6294 -.mxchat-rag-url-list li:last-child {
6295 - margin-bottom: 0;
6296 -}
6297 -
6298 -.mxchat-rag-url-list a {
6299 - color: #2563eb;
6300 - text-decoration: none;
6301 -}
6302 -
6303 -.mxchat-rag-url-list a:hover {
6304 - text-decoration: underline;
6305 -}
6306 -
6307 -/* Responsive adjustments */
6308 -@media (max-width: 640px) {
6309 - .mxchat-rag-modal-overlay {
6310 - padding: 16px;
6311 - }
6312 -
6313 - .mxchat-rag-modal-content {
6314 - max-height: calc(100vh - 32px);
6315 - border-radius: 12px;
6316 - }
6317 -
6318 - .mxchat-rag-modal-header {
6319 - padding: 16px 20px;
6320 - }
6321 -
6322 - .mxchat-rag-modal-body {
6323 - padding: 20px;
6324 - }
6325 -
6326 - .mxchat-rag-summary {
6327 - flex-wrap: wrap;
6328 - gap: 16px;
6329 - }
6330 -
6331 - .mxchat-rag-match-header {
6332 - flex-wrap: wrap;
6333 - }
6334 -
6335 - .mxchat-rag-match-status {
6336 - margin-left: 0;
6337 - margin-top: 8px;
6338 - }
6339 -}
6340 -
6341 -/* ========================================
6342 - POST TYPE VISIBILITY SETTINGS
6343 - ======================================== */
6344 -.mxchat-sub-options {
6345 - margin-top: 20px;
6346 - padding: 20px;
6347 - background: #f8f9fa;
6348 - border: 1px solid #e2e4e7;
6349 - border-radius: 8px;
6350 - transition: all 0.3s ease;
6351 -}
6352 -
6353 -.mxchat-post-type-visibility-header {
6354 - margin-bottom: 16px;
6355 -}
6356 -
6357 -.mxchat-post-type-visibility-header h4 {
6358 - margin: 0 0 6px 0;
6359 - font-size: 14px;
6360 - font-weight: 600;
6361 - color: #1e1e1e;
6362 -}
6363 -
6364 -.mxchat-post-type-visibility-header .description {
6365 - margin: 0;
6366 - color: #757575;
6367 -}
6368 -
6369 -.mxchat-visibility-mode {
6370 - display: flex;
6371 - flex-direction: column;
6372 - gap: 10px;
6373 - margin-bottom: 16px;
6374 -}
6375 -
6376 -.mxchat-radio-label {
6377 - display: flex;
6378 - align-items: center;
6379 - gap: 10px;
6380 - cursor: pointer;
6381 - padding: 10px 14px;
6382 - background: #fff;
6383 - border: 1px solid #dcdcde;
6384 - border-radius: 6px;
6385 - transition: all 0.2s ease;
6386 - font-size: 14px;
6387 -}
6388 -
6389 -.mxchat-radio-label:hover {
6390 - border-color: #2271b1;
6391 - background: #f6f7f7;
6392 -}
6393 -
6394 -.mxchat-radio-label input[type="radio"] {
6395 - margin: 0;
6396 - width: 16px;
6397 - height: 16px;
6398 - accent-color: #2271b1;
6399 -}
6400 -
6401 -.mxchat-radio-label input[type="radio"]:checked + span {
6402 - font-weight: 500;
6403 - color: #1e1e1e;
6404 -}
6405 -
6406 -.mxchat-radio-label span {
6407 - color: #50575e;
6408 -}
6409 -
6410 -.mxchat-post-type-list {
6411 - display: grid;
6412 - grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
6413 - gap: 10px;
6414 - padding: 16px;
6415 - background: #fff;
6416 - border: 1px solid #dcdcde;
6417 - border-radius: 6px;
6418 - max-height: 200px;
6419 - overflow-y: auto;
6420 -}
6421 -
6422 -.mxchat-post-type-list .mxchat-checkbox-label {
6423 - display: flex;
6424 - align-items: center;
6425 - gap: 10px;
6426 - padding: 8px 12px;
6427 - background: #f8f9fa;
6428 - border: 1px solid #e2e4e7;
6429 - border-radius: 4px;
6430 - cursor: pointer;
6431 - transition: all 0.2s ease;
6432 - font-size: 13px;
6433 -}
6434 -
6435 -.mxchat-post-type-list .mxchat-checkbox-label:hover {
6436 - border-color: #2271b1;
6437 - background: #f0f6fc;
6438 -}
6439 -
6440 -.mxchat-post-type-list .mxchat-checkbox-label input[type="checkbox"] {
6441 - margin: 0;
6442 - width: 16px;
6443 - height: 16px;
6444 - accent-color: #2271b1;
6445 -}
6446 -
6447 -.mxchat-post-type-list .mxchat-checkbox-label input[type="checkbox"]:checked + span {
6448 - font-weight: 500;
6449 - color: #1e1e1e;
6450 -}
6451 -
6452 -.mxchat-post-type-list .mxchat-checkbox-label span {
6453 - color: #50575e;
6454 -}
6455 -
6456 -/* Custom scrollbar for post type list */
6457 -.mxchat-post-type-list::-webkit-scrollbar {
6458 - width: 6px;
6459 -}
6460 -
6461 -.mxchat-post-type-list::-webkit-scrollbar-track {
6462 - background: #f1f1f1;
6463 - border-radius: 3px;
6464 -}
6465 -
6466 -.mxchat-post-type-list::-webkit-scrollbar-thumb {
6467 - background: #c1c1c1;
6468 - border-radius: 3px;
6469 -}
6470 -
6471 -.mxchat-post-type-list::-webkit-scrollbar-thumb:hover {
6472 - background: #a1a1a1;
6473 -}
6474 -
6475 -/* Responsive adjustments */
6476 -@media (max-width: 782px) {
6477 - .mxchat-sub-options {
6478 - padding: 16px;
6479 - }
6480 -
6481 - .mxchat-post-type-list {
6482 - grid-template-columns: 1fr;
6483 - }
6484 -}
6485 -/* 3.2.3: Embedding model switch warning dialog */
6486 -.mxchat-embed-warn-overlay {
6487 - position: fixed;
6488 - inset: 0;
6489 - background: rgba(20, 20, 20, 0.55);
6490 - z-index: 200000;
6491 - display: flex;
6492 - align-items: center;
6493 - justify-content: center;
6494 - padding: 24px;
6495 -}
6496 -.mxchat-embed-warn-dialog {
6497 - background: #fff;
6498 - max-width: 640px;
6499 - width: 100%;
6500 - border-radius: 8px;
6501 - box-shadow: 0 24px 60px rgba(0,0,0,0.35);
6502 - overflow: hidden;
6503 - font-size: 14px;
6504 - line-height: 1.5;
6505 -}
6506 -.mxchat-embed-warn-header {
6507 - display: flex;
6508 - align-items: center;
6509 - gap: 12px;
6510 - padding: 18px 22px;
6511 - background: #fef6f6;
6512 - border-bottom: 1px solid #f1d4d4;
6513 -}
6514 -.mxchat-embed-warn-header h3 {
6515 - margin: 0;
6516 - font-size: 16px;
6517 - color: #b32d2e;
6518 -}
6519 -.mxchat-embed-warn-icon {
6520 - font-size: 22px;
6521 - line-height: 1;
6522 -}
6523 -.mxchat-embed-warn-body {
6524 - padding: 18px 22px;
6525 - color: #2c3338;
6526 -}
6527 -.mxchat-embed-warn-body p {
6528 - margin: 0 0 12px 0;
6529 -}
6530 -.mxchat-embed-warn-body code {
6531 - background: #f0f0f1;
6532 - padding: 1px 6px;
6533 - border-radius: 3px;
6534 - font-size: 13px;
6535 -}
6536 -.mxchat-embed-warn-body ol {
6537 - margin: 8px 0 0 18px;
6538 - padding: 0;
6539 -}
6540 -.mxchat-embed-warn-body ol li {
6541 - margin: 4px 0;
6542 -}
6543 -.mxchat-embed-warn-dims {
6544 - margin: 12px 0;
6545 - padding: 12px;
6546 - background: #fff8e5;
6547 - border-left: 3px solid #dba617;
6548 - font-size: 13px;
6549 -}
6550 -.mxchat-embed-warn-footer {
6551 - display: flex;
6552 - justify-content: flex-end;
6553 - gap: 10px;
6554 - padding: 14px 22px;
6555 - background: #f6f7f7;
6556 - border-top: 1px solid #dcdcde;
6557 -}
6558 -.mxchat-embed-warn-danger {
6559 - background: #b32d2e !important;
6560 - border-color: #b32d2e !important;
6561 - color: #fff !important;
6562 -}
6563 -.mxchat-embed-warn-danger:hover,
6564 -.mxchat-embed-warn-danger:focus {
6565 - background: #8c2122 !important;
6566 - border-color: #8c2122 !important;
6567 -}