PluginProbe ʕ •ᴥ•ʔ
GPTranslate – Multilingual AI Translation for WordPress: Automatically Translate Websites / 2.28
GPTranslate – Multilingual AI Translation for WordPress: Automatically Translate Websites v2.28
2.33.6 2.33.5 2.33.2 2.32.10 2.33 2.33.1 2.32.6 2.32.7 2.32.8 trunk 2.10.3 2.10.4 2.10.5 2.10.6 2.11 2.12 2.13 2.14 2.14.1 2.15 2.15.1 2.16.1 2.16.2 2.17 2.18 2.18.1 2.18.2 2.19 2.20 2.21 2.22 2.23 2.24 2.25 2.25.1 2.25.2 2.26 2.27 2.27.10 2.27.5 2.28 2.28.1 2.29 2.30 2.31 2.32 2.32.5
gptranslate / assets / css / admin.css
gptranslate / assets / css Last commit date
admin.css 2 months ago bootstrap.min.css 2 months ago crawler.css 2 months ago select2.min.css 2 months ago
admin.css
1032 lines
1 #wpbody-content > h1 {
2 position: relative;
3 color: #1d2327;
4 font-size: 2em;
5 margin: 0;
6 margin-left: -20px;
7 background: #FFF;
8 padding: 20px;
9 border: 1px solid #c3c4c7;
10 }
11
12 div.notice {
13 margin: 5px 20px 5px 0;
14 }
15
16 h2.nav-tab-wrapper {
17 margin-top: 20px;
18 }
19
20 img.gptranslate-plugin-icon {
21 width: 64px;
22 height: 64px;
23 }
24
25 /* Labels */
26 .gpt-label {
27 display: inline-block;
28 padding: 2px 8px;
29 font-size: 1em;
30 font-weight: 600;
31 color: #fff;
32 background-color: #0073aa; /* WordPress blue */
33 border-radius: 12px;
34 vertical-align: middle;
35 white-space: nowrap;
36 }
37
38 /* Success label */
39 .gpt-label-success {
40 background-color: #46b450;
41 }
42
43 /* Danger label */
44 .gpt-label-danger {
45 background-color: #dc3232;
46 }
47
48 /* Warning label */
49 .gpt-label-warning {
50 background-color: #ffb900;
51 color: #000;
52 }
53
54 /* Buttons */
55 .gpt-button {
56 display: inline-block;
57 padding: 6px 12px;
58 font-size: 14px;
59 font-weight: 600;
60 color: #fff;
61 background-color: #0073aa;
62 border: none;
63 border-radius: 2px;
64 cursor: pointer;
65 text-decoration: none;
66 transition: background-color 0.2s;
67 }
68
69 .gpt-button:hover {
70 background-color: #006799;
71 text-decoration: none;
72 }
73
74 /* Button variants */
75 .gpt-button-danger {
76 background-color: #dc3232;
77 }
78
79 .gpt-button-danger:hover {
80 background-color: #b81b1b;
81 }
82
83 .gpt-button-success {
84 background-color: #46b450;
85 }
86
87 .gpt-button-success:hover {
88 background-color: #3ea145;
89 }
90
91 /* Table styling */
92 .gpt-table {
93 width: 100%;
94 border-collapse: collapse;
95 margin-bottom: 20px;
96 }
97
98 .gpt-table th, .gpt-table td {
99 padding: 8px 10px;
100 border: 1px solid #ccc;
101 text-align: left;
102 }
103
104 .gpt-table th {
105 background-color: #f9f9f9;
106 font-weight: 600;
107 }
108
109 .form-table th {
110 vertical-align: top;
111 text-align: left;
112 padding: 20px 10px 10px 10px;
113 width: 200px;
114 line-height: 1.3;
115 font-weight: 600;
116 border-left: 1px solid #2271b1;
117 border-left-width: 4px;
118 box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
119 }
120
121 #tab-translator .form-table th {
122 width: 280px;
123 }
124
125 .form-table td {
126 box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
127 }
128
129 /* Edit record translation */
130 #wpfooter {
131 display: none !important;
132 }
133
134 input[name=pagelink], input[name=translated_alias], div.gptcard {
135 width: 60%;
136 }
137
138 @media ( max-width : 1024px) {
139 input[name=pagelink], div.gptcard {
140 width: 100%;
141 }
142 }
143
144 div.accordion-body {
145 max-height: 800px;
146 overflow: auto;
147 }
148
149 /* Search */
150 div.gptcard-header button, div.gptcard-header input {
151 font-weight: normal;
152 white-space: nowrap;
153 }
154
155 /* Sort dropdown */
156 .gpt-sort-select {
157 padding: 4px 8px;
158 font-size: 13px;
159 border: 1px solid #8c8f94;
160 border-radius: 4px;
161 background: #fff;
162 color: #2c3338;
163 cursor: pointer;
164 height: 30px;
165 margin-left: 4px;
166 }
167
168 .gpt-sort-select:focus {
169 border-color: #2271b1;
170 box-shadow: 0 0 0 1px #2271b1;
171 outline: none;
172 }
173
174 input[name=search] {
175 width: 50%;
176 }
177
178 /* Container */
179 form.form-filter-container {
180 display: flex;
181 justify-content: space-between;
182 margin-bottom: 10px;
183 position: relative;
184 }
185
186 div.right-filter-container input[type="submit"] {
187 margin: 0 1px;
188 }
189
190 .translations-container {
191 max-width: 100%;
192 padding: 1rem;
193 font-family: sans-serif;
194 }
195
196 *.doublesize-icon {
197 font-size: 18px;
198 font-weight: 700;
199 margin-left: 5px;
200 }
201
202 #search-input {
203 min-width: 300px;
204 margin-right: 2px;
205 }
206
207 #search-input+button,
208 #search-input+button+button {
209 margin-right: 2px;
210 }
211
212 /* Card */
213 .gptcard {
214 border: 1px solid #ddd;
215 border-radius: 6px;
216 margin-bottom: 1rem;
217 background-color: #fff;
218 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
219 }
220
221 /* Card header */
222 .gptcard-header {
223 background-color: #f5f5f5;
224 padding: 0.75rem 1rem;
225 border-bottom: 1px solid #ddd;
226 font-weight: bold;
227 }
228
229 .gptcard-header [data-role="search-translations"],
230 .gptcard-header [data-role="reset-search"] {
231 white-space: nowrap;
232 font-weight: normal;
233 }
234
235 /* Accordion toggle area */
236 .accordion-toggle {
237 display: flex;
238 align-items: center;
239 gap: 1rem;
240 }
241
242 /* Input group */
243 .input-group {
244 display: flex;
245 align-items: center;
246 gap: 0.5rem;
247 flex-wrap: nowrap;
248 width: 100%;
249 }
250
251 .input-group-text {
252 background-color: #e9ecef;
253 padding: 0.5rem 0.75rem;
254 border-radius: 4px;
255 font-size: 0.875rem;
256 }
257
258 #migraterow span.input-group label {
259 white-space: nowrap;
260 }
261
262 table.widefat input.form-check-input {
263 margin: 0;
264 }
265
266 /* Card body */
267 .gptcard-body {
268 padding: 1rem;
269 }
270
271 div.translation-row.translation-row-hidden {
272 display: none;
273 }
274
275 /* Buttons */
276 .btn {
277 display: inline-block;
278 padding: 0.375rem 0.75rem;
279 border-radius: 2px;
280 border: none;
281 font-size: 0.875rem;
282 cursor: pointer;
283 }
284
285 .btn-sm {
286 font-size: 0.75rem;
287 padding: 0.25rem 0.5rem;
288 }
289
290 .btn-primary {
291 background-color: #2271b1;
292 color: white;
293 }
294
295 .btn-success {
296 background-color: #198754;
297 color: white;
298 }
299
300 .btn-danger {
301 background-color: #dc3545;
302 color: white;
303 }
304
305 .btn-warning {
306 background-color: #ffc107;
307 color: black;
308 }
309
310 span.icon-refresh {
311 display: inline-block;
312 }
313
314 button.group-sync.btn-invisible {
315 display: none;
316 }
317
318 button.group-sync span.icon-refresh.icon-working {
319 animation: spin 2s infinite linear;
320 }
321
322 @keyframes spin {
323 0% {
324 transform: rotate(0deg);
325 }
326 100% {
327 transform: rotate(360deg);
328 }
329 }
330
331 /* Badges */
332 .badge {
333 display: inline-block;
334 padding: 0.35em 0.65em;
335 font-size: 1em;
336 font-weight: 600;
337 border-radius: 3px;
338 margin-bottom: 0.25rem;
339 }
340
341 /* Colori di stato */
342 .bg-primary {
343 background-color: #2271b1;
344 color: #FFFFFF;
345 }
346
347 .bg-success {
348 background-color: #28a745;
349 color: #FFFFFF;
350 }
351
352 .bg-danger {
353 background-color: #dc3545;
354 color: #FFFFFF;
355 }
356
357 .bg-warning {
358 background-color: #ffc107;
359 color: #212529;
360 }
361
362 .bg-info {
363 background-color: #17a2b8;
364 color: #FFFFFF;
365 }
366
367 /* Zero state */
368 .gptranslate-zero-state {
369 max-width: 720px;
370 margin: 80px auto;
371 padding: 40px;
372 background: #ffffff;
373 border-radius: 8px;
374 border: 1px solid #e5e5e5;
375 text-align: center;
376 }
377
378 .gptranslate-zero-title {
379 font-size: 24px;
380 font-weight: 600;
381 margin-bottom: 10px;
382 }
383
384 .gptranslate-zero-icon {
385 margin-bottom: 20px;
386 opacity: 0.9;
387 }
388
389 .gptranslate-zero-desc {
390 font-size: 15px;
391 color: #555;
392 margin-bottom: 30px;
393 }
394
395 .gptranslate-zero-hint {
396 margin-top: 20px;
397 font-size: 13px;
398 color: #777;
399 }
400
401 #gptranslate-start-crawler span.dashicons-before::before {
402 vertical-align: middle;
403 margin-right: 10px;
404 }
405
406 /* Textarea */
407 .translation-row textarea {
408 width: 198px;
409 height: 60px;
410 }
411
412 /* Translation row */
413 .translation-row {
414 padding-top: 1rem;
415 margin-top: 1rem;
416 display: flex;
417 align-items: center;
418 column-gap: 10px;
419 align-items: center;
420 position: relative;
421 }
422
423 .translation-row label.gpt-label.badge {
424 position: absolute;
425 right: 1px;
426 top: 0;
427 font-size: 12px;
428 }
429
430 /* Tooltips */
431 .custom-tooltip {
432 position: absolute;
433 top: 0;
434 left: 0;
435 z-index: 9999;
436 background: #333;
437 color: #fff;
438 padding: 6px 10px;
439 font-size: 0.85em;
440 border-radius: 4px;
441 max-width: 250px;
442 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
443 pointer-events: none;
444 opacity: 0;
445 transition: opacity 0.2s ease;
446 white-space: normal;
447 }
448
449 /* Settings with switchers */
450 a.nav-tab:focus {
451 box-shadow: none;
452 }
453
454 div.tab-content > p:first-child,
455 div.tab-content > p:last-child {
456 text-align: right;
457 margin-right: 20px;
458 }
459
460 #config-gptranslate table.form-table {
461 margin-top: -40px;
462 }
463
464 table.form-table th.settings-label-separator {
465 border: none;
466 background: #2271b1;
467 color: #FFF;
468 text-align: center;
469 padding: 0;
470 vertical-align: middle;
471 border-left: 4px solid #2271b1;
472 }
473
474 table.widefat.fixed.striped a:focus {
475 box-shadow: none;
476 }
477
478 table tr.alt_translations_0 {
479 display: none;
480 }
481
482 /* API Key field with eye-toggle */
483 .gpt-apikey-wrap {
484 display: flex;
485 align-items: center;
486 gap: 0;
487 }
488 .gpt-apikey-wrap .button {
489 padding: 0 12px;
490 height: 30px;
491 line-height: 30px;
492 flex-shrink: 0;
493 background: #f6f7f7;
494 }
495 .gpt-apikey-wrap .dashicons {
496 font-size: 18px;
497 width: 18px;
498 height: 18px;
499 margin-top: 4px;
500 }
501
502 .gpt-apikey-wrap .dashicons.dashicons-visibility,
503 .gpt-apikey-wrap .dashicons.dashicons-hidden {
504 line-height: normal;
505 }
506
507 .gpt-apikey-wrap .large-apikey {
508 width: 50%;
509 }
510
511 .toggle-import {
512 background: #FFF;
513 padding: 4px 5px;
514 }
515
516 .wp-admin input[type=file] {
517 border: 1px solid #CCC;
518 border-radius: 4px;
519 padding-left: 5px;
520 }
521
522 div.exportimportbtns {
523 position: relative;
524 display: flex;
525 justify-content: flex-end;
526 margin-top: -40px;
527 column-gap: 5px;
528 margin-right: 20px;
529 }
530
531 #add-repeatable-row {
532 float: right;
533 }
534
535 #bulk-delete-btn, #toggle-migration {
536 margin-right: 10px;
537 }
538
539 #migraterow {
540 width: fit-content;
541 margin-bottom: 10px;
542 background: #FFF;
543 padding: 5px 10px;
544 border-radius: 4px;
545 }
546
547 #migraterow .input-group {
548 width: auto;
549 margin-right: 10px;
550 }
551
552 #migraterow .button {
553 margin-right: 5px;
554 }
555
556 /* Pagination */
557 .tablenav-pages {
558 margin-top: 20px;
559 }
560
561 .tablenav-pages .button {
562 margin-bottom: 4px !important;
563 margin-right: 5px;
564 padding: 5px 10px;
565 text-decoration: none;
566 }
567
568 .tablenav-pages .current-page {
569 font-weight: bold;
570 background-color: #0073aa;
571 color: #fff;
572 }
573
574 div.action-buttons-toolbar {
575 margin: 5px 0 10px;
576 }
577
578 input[name='import_file'] {
579 margin-left: 5px;
580 }
581
582 #translations_json {
583 display: none !important;
584 }
585
586 .wp-core-ui .button-warning,
587 .wp-core-ui .button-warning:focus,
588 .wp-core-ui .button-warning:active {
589 background: #f15116;
590 border-color: #d43900;
591 color: #fff;
592 }
593
594 .wp-core-ui .button-warning:hover {
595 background: #d43900;
596 border-color: #d43900;
597 color: #fff;
598 }
599
600 .wp-core-ui .button-warning.button-crawler {
601 position: absolute;
602 top: 40px;
603 right: 0;
604 box-shadow: none;
605 }
606
607 div.wrap:has(input.button-crawler) {
608 position: relative;
609 }
610
611 div.wrap:has(#notranslations-notice) .button-warning.button-crawler {
612 top: -60px;
613 }
614
615 @media (max-width: 782px) {
616 .wp-core-ui .button-warning.button-crawler {
617 top: 50px;
618 }
619 }
620
621 @media (max-width: 1280px) { body.toplevel_page_gptranslate, body.gptranslate_page_gptranslate-settings { min-width: 1280px; overflow-x: auto }}
622
623 /* GPTranslate iOS switch */
624 .wrapper {
625 position: relative;
626 display: inline-block;
627 width: 52px;
628 height: 28px;
629 vertical-align: middle;
630 cursor: pointer;
631 }
632
633 .wrapper input[type="radio"] {
634 position: absolute;
635 opacity: 0;
636 pointer-events: none;
637 }
638
639 .wrapper > label {
640 position: absolute;
641 top: 0;
642 left: 0;
643 height: 100%;
644 width: 50%;
645 cursor: pointer;
646 }
647 .wrapper > label:last-child {
648 left: 50%;
649 }
650
651 .wrapper > label > span {
652 position: absolute !important;
653 width: 1px;
654 height: 1px;
655 overflow: hidden;
656 clip: rect(1px,1px,1px,1px);
657 }
658
659 .wrapper::before {
660 content: "";
661 position: absolute;
662 inset: 0;
663 background: #bdbdbd;
664 border-radius: 999px;
665 transition: background-color 0.25s ease, box-shadow 0.25s ease;
666 box-shadow: inset 0 0 3px rgba(0,0,0,0.25);
667 pointer-events: none;
668 }
669
670 .wrapper::after {
671 position: absolute;
672 top: 3px;
673 left: 3px;
674 width: 22px;
675 height: 22px;
676 border-radius: 50%;
677 background: #fff;
678 box-shadow: 0 1px 4px rgba(0,0,0,0.3);
679 transition: transform 0.28s cubic-bezier(0.45,1.6,0.45,1), color 0.2s ease;
680 pointer-events: none;
681 display: flex;
682 align-items: center;
683 justify-content: center;
684 font-size: 14px;
685 font-weight: bold;
686 content: "";
687 }
688
689 .wrapper:has(> label:first-child > input:checked)::after {
690 content: "";
691 color: #2196f3;
692 }
693
694 .wrapper:has(> label:first-child > input:checked)::before {
695 background: #2196f3;
696 box-shadow: 0 0 0 3px rgba(33,150,243,0.18);
697 }
698 .wrapper:has(> label:first-child > input:checked)::after {
699 transform: translateX(24px);
700 }
701
702 .wrapper:has(> label:last-child > input:checked)::before {
703 background: #bdbdbd;
704 }
705 .wrapper:has(> label:last-child > input:checked)::after {
706 transform: translateX(0);
707 }
708
709 .wrapper:hover::before {
710 box-shadow: 0 0 0 3px rgba(33,150,243,0.12);
711 }
712 .wrapper input[type="radio"]:focus-visible + span {
713 outline: 2px solid rgba(33,150,243,0.45);
714 outline-offset: 2px;
715 }
716
717 /* Test API Key button */
718 #btn_test_apikey {
719 margin: 4px 0 0 1px;
720 vertical-align: middle;
721 background: #f6f7f7;
722 }
723 #btn_test_apikey:disabled {
724 opacity: 0.7;
725 cursor: wait;
726 }
727 .icon-spin {
728 animation: gpt-spin 1s linear infinite;
729 }
730 @keyframes gpt-spin {
731 0% { transform: rotate(0deg); }
732 100% { transform: rotate(360deg); }
733 }
734 #apikey_test_result {
735 display: inline-block;
736 padding: 3px 10px;
737 border-radius: 3px;
738 font-size: 13px;
739 vertical-align: middle;
740 font-weight: 500;
741 }
742 .gpt-test-success {
743 background-color: #d4edda;
744 color: #155724;
745 border: 1px solid #c3e6cb;
746 }
747 .gpt-test-error {
748 background-color: #f8d7da;
749 color: #721c24;
750 border: 1px solid #f5c6cb;
751 max-width: 500px;
752 word-break: break-word;
753 }
754
755 .gpt-field-error {
756 border-color: #dc3232 !important;
757 box-shadow: 0 0 0 1px #dc3232 !important;
758 }
759 .gpt-validation-error {
760 display: block;
761 color: #dc3232;
762 font-size: 12px;
763 margin-top: 4px;
764 margin-left: 4px;
765 margin-right: 4px;
766 }
767
768 .gpt-drag-over-before {
769 border-top: 3px solid #2271b1;
770 box-shadow: 0 -2px 6px rgba(34, 113, 177, 0.35);
771 }
772 .gpt-drag-over-after {
773 border-bottom: 3px solid #2271b1;
774 box-shadow: 0 2px 6px rgba(34, 113, 177, 0.35);
775 }
776
777 /* Targetta ogni body che ha una classe 'branch-' seguita da un numero >= 7 */
778 body[class*="branch-7"] .wrapper:has(> label:first-child > input:checked)::after,
779 body[class*="branch-8"] .wrapper:has(> label:first-child > input:checked)::after,
780 body[class*="branch-9"] .wrapper:has(> label:first-child > input:checked)::after {
781 color: #3858e9;
782 }
783
784 body[class*="branch-7"] .wrapper:has(> label:first-child > input:checked)::before,
785 body[class*="branch-8"] .wrapper:has(> label:first-child > input:checked)::before,
786 body[class*="branch-9"] .wrapper:has(> label:first-child > input:checked)::before {
787 background: #3858e9;
788 }
789
790 body[class*="branch-7"] table.form-table th.settings-label-separator,
791 body[class*="branch-8"] table.form-table th.settings-label-separator,
792 body[class*="branch-9"] table.form-table th.settings-label-separator {
793 background: #3858e9;
794 border-left: 4px solid #3858e9;
795 }
796
797 body[class*="branch-7"] div.exportimportbtns,
798 body[class*="branch-8"] div.exportimportbtns,
799 body[class*="branch-9"] div.exportimportbtns {
800 margin-top: -50px;
801 }
802
803
804 body[class*="branch-7"] input[name="gptranslate_settings_file"],
805 body[class*="branch-8"] input[name="gptranslate_settings_file"],
806 body[class*="branch-9"] input[name="gptranslate_settings_file"],
807 body[class*="branch-7"] input[name="import_file"],
808 body[class*="branch-8"] input[name="import_file"],
809 body[class*="branch-9"] input[name="import_file"] {
810 border: 1px solid #CCC;
811 border-radius: 4px;
812 padding-left: 5px;
813 padding: 8px;
814 }
815
816 body[class*="branch-7"] .gpt-label:not([class*="bg-"]),
817 body[class*="branch-8"] .gpt-label:not([class*="bg-"]),
818 body[class*="branch-9"] .gpt-label:not([class*="bg-"]) {
819 background-color: #3858e9;
820 }
821
822 body[class*="branch-7"].wp-core-ui .button-warning.button-crawler,
823 body[class*="branch-8"].wp-core-ui .button-warning.button-crawler,
824 body[class*="branch-9"].wp-core-ui .button-warning.button-crawler {
825 top: 50px;
826 }
827
828 body[class*="branch-7"] .bg-primary,
829 body[class*="branch-8"] .bg-primary,
830 body[class*="branch-9"] .bg-primary,
831 body[class*="branch-7"] .btn-primary,
832 body[class*="branch-8"] .btn-primary,
833 body[class*="branch-9"] .btn-primary {
834 background-color: #3858e9;
835 }
836
837 body[class*="branch-7"] #btn_test_apikey span.dashicons,
838 body[class*="branch-8"] #btn_test_apikey span.dashicons,
839 body[class*="branch-9"] #btn_test_apikey span.dashicons {
840 line-height: normal;
841 margin-top: -1px;
842 }
843
844 body[class*="branch-7"] div.notice.notice-success,
845 body[class*="branch-8"] div.notice.notice-success,
846 body[class*="branch-9"] div.notice.notice-success {
847 border-top: 1px solid #4ab866;
848 border-right: 1px solid #4ab866;
849 border-bottom: 1px solid #4ab866;
850 }
851
852 body[class*="branch-7"] div.notice.notice-warning,
853 body[class*="branch-8"] div.notice.notice-warning,
854 body[class*="branch-9"] div.notice.notice-warning {
855 border-top: 1px solid #f0b849;
856 border-right: 1px solid #f0b849;
857 border-bottom: 1px solid #f0b849;
858 }
859
860 body[class*="branch-7"].wp-core-ui div.left-filter-container .button,
861 body[class*="branch-8"].wp-core-ui div.left-filter-container .button,
862 body[class*="branch-9"].wp-core-ui div.left-filter-container .button,
863 body[class*="branch-7"].wp-core-ui div.right-filter-container .button,
864 body[class*="branch-8"].wp-core-ui div.right-filter-container .button,
865 body[class*="branch-9"].wp-core-ui div.right-filter-container .button {
866 background: #f6f7f7;
867 }
868
869 body[class*="branch-7"] .form-table th,
870 body[class*="branch-8"] .form-table th,
871 body[class*="branch-9"] .form-table th {
872 border-left-color: #3858e9;
873 }
874
875 body[class*="branch-7"] input[name="exactmatch"],
876 body[class*="branch-8"] input[name="exactmatch"],
877 body[class*="branch-9"] input[name="exactmatch"]{
878 border: 1px solid #3858e9;
879 }
880
881 body[class*="branch-7"] .gpt-apikey-wrap .dashicons,
882 body[class*="branch-8"] .gpt-apikey-wrap .dashicons,
883 body[class*="branch-9"] .gpt-apikey-wrap .dashicons {
884 margin-top: 5px;
885 }
886
887 /* Rate us button & review modal */
888 #gpt-rate-btn {
889 position: absolute;
890 top: 5px;
891 right: 0;
892 z-index: 9990;
893 display: flex;
894 align-items: center;
895 gap: 5px;
896 background: #fff;
897 border: 1px solid #ddd;
898 border-right: none;
899 border-radius: 4px 0 0 4px;
900 padding: 5px 10px 5px 10px;
901 font-size: 12px;
902 font-weight: 600;
903 color: #444;
904 cursor: pointer;
905 box-shadow: -2px 2px 6px rgba(0, 0, 0, .08);
906 transition: background .15s;
907 display: none;
908 }
909
910 #gpt-rate-btn:hover {
911 background: #fafafa;
912 }
913
914 #gpt-rate-btn .gpt-heart {
915 color: #e03e3e;
916 font-size: 13px;
917 }
918
919 #gpt-rate-btn .gpt-stars {
920 color: #f0b429;
921 letter-spacing: 1px;
922 }
923
924 #gpt-review-overlay {
925 display: none;
926 position: fixed;
927 inset: 0;
928 background: rgba(0, 0, 0, .45);
929 z-index: 99998;
930 align-items: center;
931 justify-content: center;
932 }
933
934 #gpt-review-overlay.open {
935 display: flex;
936 }
937
938 #gpt-review-box {
939 background: #fff;
940 border-radius: 8px;
941 padding: 30px 32px 24px;
942 max-width: 400px;
943 width: 90%;
944 box-shadow: 0 8px 32px rgba(0, 0, 0, .22);
945 position: relative;
946 text-align: center;
947 }
948
949 #gpt-review-close {
950 position: absolute;
951 top: 10px;
952 right: 14px;
953 background: none;
954 border: none;
955 font-size: 20px;
956 cursor: pointer;
957 color: #aaa;
958 line-height: 1;
959 }
960
961 #gpt-review-close:hover {
962 color: #555;
963 }
964
965 .gpt-review-stars {
966 color: #f0b429;
967 font-size: 26px;
968 letter-spacing: 3px;
969 margin: 4px 0 10px;
970 }
971
972 .gpt-review-title {
973 margin: 0 0 10px;
974 font-size: 16px;
975 font-weight: 700;
976 color: #1d2327;
977 }
978
979 .gpt-review-desc {
980 margin: 0 0 20px;
981 color: #555;
982 font-size: 13px;
983 line-height: 1.65;
984 }
985
986 .gpt-review-cta {
987 display: inline-block;
988 background: #2271b1;
989 color: #fff !important;
990 padding: 9px 22px;
991 border-radius: 4px;
992 text-decoration: none !important;
993 font-size: 13px;
994 font-weight: 600;
995 margin-bottom: 16px;
996 }
997
998 .gpt-review-cta:hover {
999 background: #135e96;
1000 }
1001
1002 .gpt-review-links {
1003 font-size: 12px;
1004 }
1005
1006 .gpt-review-links a {
1007 color: #aaa;
1008 text-decoration: none;
1009 margin: 0 8px;
1010 }
1011
1012 .gpt-review-links a:hover {
1013 color: #777;
1014 }
1015
1016 .gpt-review-footer {
1017 margin-top: 18px;
1018 padding-top: 14px;
1019 border-top: 1px solid #f0f0f0;
1020 font-size: 11px;
1021 color: #bbb;
1022 }
1023
1024 .gpt-review-footer a {
1025 color: #bbb;
1026 text-decoration: none;
1027 }
1028
1029 .gpt-review-footer a:hover {
1030 color: #888;
1031 }
1032