@pelcro/react-pelcro-js 4.0.0-alpha.6 → 4.0.0-alpha.61

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/pelcro.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import url("https://fonts.googleapis.com/css2?family=Tajawal:wght@400;700&display=swap");
2
+
1
3
  /* globals */
2
4
 
3
5
  /*! modern-normalize v1.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
@@ -54,7 +56,7 @@ Improve consistency of default fonts in all browsers. (https://github.com/sindre
54
56
  */
55
57
 
56
58
  .pelcro-root {
57
- font-family: system-ui, -apple-system,
59
+ font-family: "Lato", system-ui, -apple-system,
58
60
  /* Firefox supports this but not yet `system-ui` */ "Segoe UI",
59
61
  Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji",
60
62
  "Segoe UI Emoji";
@@ -107,7 +109,7 @@ Add the correct font weight in Edge and Safari.
107
109
  .pelcro-root kbd,
108
110
  .pelcro-root samp,
109
111
  .pelcro-root pre {
110
- font-family: ui-monospace, SFMono-Regular, Consolas,
112
+ font-family: "Lato", ui-monospace, SFMono-Regular, Consolas,
111
113
  "Liberation Mono", Menlo, monospace; /* 1 */
112
114
  font-size: 1em; /* 2 */
113
115
  }
@@ -326,7 +328,7 @@ Add the correct display in Chrome and Safari.
326
328
  */
327
329
 
328
330
  .pelcro-root {
329
- font-family: ui-sans-serif, system-ui, -apple-system,
331
+ font-family: "Lato", ui-sans-serif, system-ui, -apple-system,
330
332
  BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
331
333
  "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
332
334
  "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
@@ -457,8 +459,8 @@ Add the correct display in Chrome and Safari.
457
459
  .pelcro-root code,
458
460
  .pelcro-root kbd,
459
461
  .pelcro-root samp {
460
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
461
- "Liberation Mono", "Courier New", monospace;
462
+ font-family: "Lato", ui-monospace, SFMono-Regular, Menlo, Monaco,
463
+ Consolas, "Liberation Mono", "Courier New", monospace;
462
464
  }
463
465
 
464
466
  /**
@@ -548,7 +550,7 @@ Add the correct display in Chrome and Safari.
548
550
  background-size: 1.5em 1.5em;
549
551
  padding-right: 2.5rem;
550
552
  -webkit-print-color-adjust: exact;
551
- color-adjust: exact;
553
+ print-color-adjust: exact;
552
554
  }
553
555
 
554
556
  .pelcro-root [multiple] {
@@ -558,7 +560,7 @@ Add the correct display in Chrome and Safari.
558
560
  background-size: initial;
559
561
  padding-right: 0.75rem;
560
562
  -webkit-print-color-adjust: unset;
561
- color-adjust: unset;
563
+ print-color-adjust: unset;
562
564
  }
563
565
 
564
566
  .pelcro-root [type="checkbox"],
@@ -567,7 +569,7 @@ Add the correct display in Chrome and Safari.
567
569
  appearance: none;
568
570
  padding: 0;
569
571
  -webkit-print-color-adjust: exact;
570
- color-adjust: exact;
572
+ print-color-adjust: exact;
571
573
  display: inline-block;
572
574
  vertical-align: middle;
573
575
  background-origin: border-box;
@@ -703,53 +705,52 @@ Add the correct display in Chrome and Safari.
703
705
  width: 100%;
704
706
  }
705
707
 
706
- @media (min-width: 640px) {
707
- .pelcro-root .pelcro-modal {
708
+ @media (min-width: 425px){
709
+ .pelcro-root .pelcro-modal{
710
+ max-width: 425px;
711
+ }
712
+ }
713
+
714
+ @media (min-width: 640px){
715
+ .pelcro-root .pelcro-modal{
708
716
  max-width: 640px;
709
717
  }
710
718
  }
711
719
 
712
- @media (min-width: 768px) {
713
- .pelcro-root .pelcro-modal {
720
+ @media (min-width: 768px){
721
+ .pelcro-root .pelcro-modal{
714
722
  max-width: 768px;
715
723
  }
716
724
  }
717
725
 
718
- @media (min-width: 1024px) {
719
- .pelcro-root .pelcro-modal {
726
+ @media (min-width: 1024px){
727
+ .pelcro-root .pelcro-modal{
720
728
  max-width: 1024px;
721
729
  }
722
730
  }
723
731
 
724
- @media (min-width: 1280px) {
725
- .pelcro-root .pelcro-modal {
732
+ @media (min-width: 1280px){
733
+ .pelcro-root .pelcro-modal{
726
734
  max-width: 1280px;
727
735
  }
728
736
  }
729
737
 
730
- @media (min-width: 1536px) {
731
- .pelcro-root .pelcro-modal {
738
+ @media (min-width: 1536px){
739
+ .pelcro-root .pelcro-modal{
732
740
  max-width: 1536px;
733
741
  }
734
742
  }
735
743
 
736
- .pelcro-root .pelcro-modal {
744
+ .pelcro-root .pelcro-modal{
737
745
  position: absolute;
738
- top: 0px;
739
746
  display: flex;
740
- max-width: 42rem;
747
+ max-width: 32rem;
741
748
  flex-direction: column;
742
749
  align-items: center;
743
- overflow: hidden;
744
750
  border-radius: 0.5rem;
745
751
  --tw-bg-opacity: 1;
746
752
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
747
- }
748
-
749
- @media (min-width: 768px) {
750
- .pelcro-root .pelcro-modal {
751
- margin-top: 2rem;
752
- }
753
+ max-height: 100vh;
753
754
  }
754
755
 
755
756
  .pelcro-root .pelcro-modal-content {
@@ -759,22 +760,25 @@ Add the correct display in Chrome and Safari.
759
760
  .pelcro-root .pelcro-modal-header {
760
761
  position: relative;
761
762
  display: flex;
762
- min-height: 8rem;
763
+ min-height: 6rem;
763
764
  flex-direction: column;
765
+ border-top-left-radius: 0.5rem;
766
+ border-top-right-radius: 0.5rem;
764
767
  border-bottom-width: 2px;
768
+ border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
765
769
  --tw-bg-opacity: 1;
766
770
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
767
- padding-left: 3rem;
768
- padding-right: 3rem;
771
+ padding-left: 2.5rem;
772
+ padding-right: 2.5rem;
769
773
  padding-top: 0.75rem;
770
774
  padding-bottom: 0.75rem;
771
- border-bottom-width: 1px;
775
+ border-bottom-width: 1.5px;
772
776
  }
773
777
 
774
778
  .pelcro-root .pelcro-modal-close {
775
779
  position: absolute;
776
780
  top: 50%;
777
- right: 1.25rem;
781
+ right: 1.5rem;
778
782
  z-index: 999999;
779
783
  width: 1.5rem;
780
784
  --tw-translate-x: 0;
@@ -790,47 +794,46 @@ Add the correct display in Chrome and Safari.
790
794
  background-color: transparent;
791
795
  }
792
796
 
793
- .pelcro-root .pelcro-modal-close:hover {
797
+ .pelcro-root .pelcro-modal-close:hover{
794
798
  background-color: transparent;
795
799
  }
796
800
 
797
- .pelcro-root .pelcro-modal-close:focus {
801
+ .pelcro-root .pelcro-modal-close:focus{
798
802
  background-color: transparent;
799
803
  }
800
804
 
801
- .pelcro-root .pelcro-modal-close {
805
+ .pelcro-root .pelcro-modal-close{
802
806
  --tw-text-opacity: 1;
803
807
  color: rgba(107, 114, 128, var(--tw-text-opacity));
804
808
  }
805
809
 
806
- .pelcro-root .pelcro-modal-close:hover {
810
+ .pelcro-root .pelcro-modal-close:hover{
807
811
  --tw-text-opacity: 1;
808
812
  color: rgba(0, 0, 0, var(--tw-text-opacity));
809
813
  }
810
814
 
811
- .pelcro-root .pelcro-modal-close:focus {
815
+ .pelcro-root .pelcro-modal-close:focus{
812
816
  --tw-text-opacity: 1;
813
817
  color: rgba(0, 0, 0, var(--tw-text-opacity));
814
818
  }
815
819
 
816
- .pelcro-root .pelcro-modal-close:hover {
820
+ .pelcro-root .pelcro-modal-close:hover{
817
821
  --tw-shadow: 0 0 #0000;
818
822
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
819
823
  }
820
824
 
821
825
  .pelcro-root .pelcro-modal-body {
822
826
  --tw-bg-opacity: 1;
823
- background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
827
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
824
828
  padding-left: 1rem;
825
829
  padding-right: 1rem;
826
- padding-top: 1rem;
827
- padding-bottom: 1rem;
830
+ padding-top: 1.5rem;
828
831
  }
829
832
 
830
- @media (min-width: 768px) {
831
- .pelcro-root .pelcro-modal-body {
832
- padding-left: 4rem;
833
- padding-right: 4rem;
833
+ @media (min-width: 768px){
834
+ .pelcro-root .pelcro-modal-body{
835
+ padding-left: 2.5rem;
836
+ padding-right: 2.5rem;
834
837
  }
835
838
  }
836
839
 
@@ -839,36 +842,53 @@ Add the correct display in Chrome and Safari.
839
842
  flex-direction: column;
840
843
  align-items: center;
841
844
  justify-content: center;
845
+ border-bottom-right-radius: 0.5rem;
846
+ border-bottom-left-radius: 0.5rem;
842
847
  --tw-bg-opacity: 1;
843
- background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
844
- padding: 1rem;
845
- padding-bottom: 2.75rem;
848
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
849
+ padding-left: 1rem;
850
+ padding-right: 1rem;
851
+ padding-top: 2rem;
852
+ padding-bottom: 2rem;
846
853
  font-size: 0.875rem;
847
854
  line-height: 1.25rem;
848
855
  }
849
856
 
850
857
  .pelcro-root .pelcro-input-wrapper {
851
- margin-bottom: 1.5rem;
858
+ position: relative;
859
+ margin-bottom: 2rem;
852
860
  width: 100%;
853
861
  }
854
862
 
855
863
  .pelcro-root .pelcro-input-label {
856
- margin-bottom: 0.25rem;
864
+ position: absolute;
865
+ top: -0.5rem;
866
+ left: 0.5rem;
857
867
  display: inline-flex;
868
+ --tw-bg-opacity: 1;
869
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
870
+ padding-left: 0.25rem;
871
+ padding-right: 0.25rem;
872
+ font-size: 0.75rem;
873
+ line-height: 1rem;
858
874
  font-weight: 500;
859
875
  --tw-text-opacity: 1;
860
- color: rgba(17, 24, 39, var(--tw-text-opacity));
876
+ color: rgba(156, 163, 175, var(--tw-text-opacity));
877
+ transition-property: all;
878
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
879
+ transition-duration: 150ms;
861
880
  }
862
881
 
863
882
  .pelcro-root .pelcro-input-error {
864
883
  position: absolute;
884
+ left: 0.75rem;
865
885
  margin-top: 0.125rem;
866
886
  height: auto;
867
- font-size: 0.875rem;
868
- line-height: 1.25rem;
887
+ font-size: 0.75rem;
888
+ line-height: 1rem;
869
889
  text-transform: none;
870
890
  --tw-text-opacity: 1;
871
- color: rgba(180, 48, 43, var(--tw-text-opacity));
891
+ color: rgba(209, 70, 65, var(--tw-text-opacity));
872
892
  }
873
893
 
874
894
  .pelcro-root .pelcro-input-invalid {
@@ -876,19 +896,19 @@ Add the correct display in Chrome and Safari.
876
896
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
877
897
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
878
898
  --tw-ring-opacity: 1;
879
- --tw-ring-color: rgba(209, 70, 65, var(--tw-ring-opacity));
899
+ --tw-ring-color: rgba(219, 110, 106, var(--tw-ring-opacity));
880
900
  }
881
901
 
882
902
  .pelcro-root .pelcro-input-field {
883
- min-height: 3rem;
903
+ min-height: 1rem;
884
904
  width: 100%;
885
905
  }
886
906
 
887
- .pelcro-root .pelcro-input-field:disabled {
907
+ .pelcro-root .pelcro-input-field:disabled{
888
908
  cursor: not-allowed;
889
909
  }
890
910
 
891
- .pelcro-root .pelcro-input-field {
911
+ .pelcro-root .pelcro-input-field{
892
912
  -webkit-appearance: none;
893
913
  appearance: none;
894
914
  border-radius: 0.25rem;
@@ -897,29 +917,94 @@ Add the correct display in Chrome and Safari.
897
917
  --tw-border-opacity: 1;
898
918
  border-color: rgba(209, 213, 219, var(--tw-border-opacity));
899
919
  --tw-bg-opacity: 1;
900
- background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
920
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
901
921
  }
902
922
 
903
- .pelcro-root .pelcro-input-field:disabled {
923
+ .pelcro-root .pelcro-input-field:disabled{
904
924
  --tw-bg-opacity: 1;
905
925
  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));
906
926
  }
907
927
 
908
- .pelcro-root .pelcro-input-field {
928
+ .pelcro-root .pelcro-input-field{
909
929
  padding: 0.5rem;
910
930
  --tw-text-opacity: 1;
911
931
  color: rgba(17, 24, 39, var(--tw-text-opacity));
932
+ }
933
+
934
+ .pelcro-root .pelcro-input-field::placeholder{
935
+ color: transparent;
936
+ }
937
+
938
+ .pelcro-root .pelcro-input-field{
912
939
  outline: 2px solid transparent;
913
940
  outline-offset: 2px;
914
941
  }
915
942
 
916
- .pelcro-root .pelcro-input-field:focus {
943
+ .pelcro-root .pelcro-input-field:focus{
917
944
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
918
945
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
919
946
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
920
947
  --tw-ring-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
921
948
  }
922
949
 
950
+ .pelcro-root
951
+ .pelcro-input-field:placeholder-shown
952
+ ~ .pelcro-input-label {
953
+ top: 0.625rem;
954
+ left: 0.5rem;
955
+ font-size: 0.875rem;
956
+ line-height: 1.25rem;
957
+ font-weight: 500;
958
+ --tw-text-opacity: 1;
959
+ color: rgba(156, 163, 175, var(--tw-text-opacity));
960
+ }
961
+
962
+ .pelcro-root .pelcro-input-field:focus ~ .pelcro-input-label {
963
+ top: -0.5rem;
964
+ --tw-bg-opacity: 1;
965
+ background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
966
+ padding-left: 0.25rem;
967
+ padding-right: 0.25rem;
968
+ font-size: 0.75rem;
969
+ line-height: 1rem;
970
+ transition-property: all;
971
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
972
+ transition-duration: 150ms;
973
+ }
974
+
975
+ .pelcro-root .pelcro-input-field:disabled ~ .pelcro-input-label {
976
+ display: none;
977
+ }
978
+
979
+ /* .pelcro-root .pelcro-input-card-number-label,
980
+ .pelcro-root .pelcro-input-cvc-number-label,
981
+ .pelcro-root .pelcro-input-expiry-date-label {
982
+ @apply plc-inline-flex plc-text-gray-400 plc-font-medium plc-absolute plc--top-2 plc-left-2 plc-text-xs plc-transition-all plc-bg-white plc-px-1;
983
+ }
984
+
985
+ .pelcro-root
986
+ #pelcro-input-card-number:placeholder-shown
987
+ ~ .pelcro-input-card-number-label,
988
+ .pelcro-root
989
+ #pelcro-input-cvc-number:placeholder-shown
990
+ ~ .pelcro-input-cvc-number-label,
991
+ .pelcro-root
992
+ #pelcro-input-expiry-date:placeholder-shown
993
+ ~ .pelcro-input-expiry-date-label {
994
+ @apply plc-text-gray-400 plc-font-medium plc-top-2.5 plc-left-2 plc-text-sm;
995
+ }
996
+ .pelcro-root
997
+ #pelcro-input-card-number:focus
998
+ ~ .pelcro-input-card-number-label,
999
+ .pelcro-root
1000
+ #pelcro-input-cvc-number:focus
1001
+ ~ .pelcro-input-cvc-number-label,
1002
+ .pelcro-root
1003
+ #pelcro-input-expiry-date:focus
1004
+ ~ .pelcro-input-expiry-date-label {
1005
+ @apply plc-text-xs plc--top-2 plc-transition-all plc-bg-white plc-px-1;
1006
+ } */
1007
+
923
1008
  .pelcro-root .pelcro-checkbox-label {
924
1009
  padding-left: 0.5rem;
925
1010
  --tw-text-opacity: 1;
@@ -932,28 +1017,28 @@ Add the correct display in Chrome and Safari.
932
1017
  cursor: pointer;
933
1018
  }
934
1019
 
935
- .pelcro-root .pelcro-checkbox:disabled {
1020
+ .pelcro-root .pelcro-checkbox:disabled{
936
1021
  cursor: not-allowed;
937
1022
  }
938
1023
 
939
- .pelcro-root .pelcro-checkbox {
1024
+ .pelcro-root .pelcro-checkbox{
940
1025
  border-radius: 0.125rem;
941
1026
  }
942
1027
 
943
- .pelcro-root .pelcro-checkbox:checked {
1028
+ .pelcro-root .pelcro-checkbox:checked{
944
1029
  border-color: transparent;
945
1030
  }
946
1031
 
947
- .pelcro-root .pelcro-checkbox {
1032
+ .pelcro-root .pelcro-checkbox{
948
1033
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
949
1034
  }
950
1035
 
951
- .pelcro-root .pelcro-checkbox:disabled {
1036
+ .pelcro-root .pelcro-checkbox:disabled{
952
1037
  --tw-text-opacity: 1;
953
1038
  color: rgba(209, 213, 219, var(--tw-text-opacity));
954
1039
  }
955
1040
 
956
- .pelcro-root .pelcro-checkbox:focus {
1041
+ .pelcro-root .pelcro-checkbox:focus{
957
1042
  outline: 2px solid transparent;
958
1043
  outline-offset: 2px;
959
1044
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -981,11 +1066,11 @@ Add the correct display in Chrome and Safari.
981
1066
  width: max-content;
982
1067
  }
983
1068
 
984
- .pelcro-root .pelcro-button-solid:disabled {
1069
+ .pelcro-root .pelcro-button-solid:disabled{
985
1070
  cursor: not-allowed;
986
1071
  }
987
1072
 
988
- .pelcro-root .pelcro-button-solid {
1073
+ .pelcro-root .pelcro-button-solid{
989
1074
  align-items: center;
990
1075
  justify-content: center;
991
1076
  justify-items: center;
@@ -994,20 +1079,20 @@ Add the correct display in Chrome and Safari.
994
1079
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
995
1080
  }
996
1081
 
997
- .pelcro-root .pelcro-button-solid:hover {
1082
+ .pelcro-root .pelcro-button-solid:hover{
998
1083
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
999
1084
  }
1000
1085
 
1001
- .pelcro-root .pelcro-button-solid:focus {
1086
+ .pelcro-root .pelcro-button-solid:focus{
1002
1087
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
1003
1088
  }
1004
1089
 
1005
- .pelcro-root .pelcro-button-solid:disabled {
1090
+ .pelcro-root .pelcro-button-solid:disabled{
1006
1091
  --tw-bg-opacity: 1;
1007
1092
  background-color: rgba(156, 163, 175, var(--tw-bg-opacity));
1008
1093
  }
1009
1094
 
1010
- .pelcro-root .pelcro-button-solid {
1095
+ .pelcro-root .pelcro-button-solid{
1011
1096
  padding-left: 1.5rem;
1012
1097
  padding-right: 1.5rem;
1013
1098
  padding-top: 0.5rem;
@@ -1019,27 +1104,27 @@ Add the correct display in Chrome and Safari.
1019
1104
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1020
1105
  }
1021
1106
 
1022
- .pelcro-root .pelcro-button-solid:hover {
1107
+ .pelcro-root .pelcro-button-solid:hover{
1023
1108
  --tw-text-opacity: 1;
1024
1109
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1025
1110
  }
1026
1111
 
1027
- .pelcro-root .pelcro-button-solid:focus {
1112
+ .pelcro-root .pelcro-button-solid:focus{
1028
1113
  --tw-text-opacity: 1;
1029
1114
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1030
1115
  }
1031
1116
 
1032
- .pelcro-root .pelcro-button-solid:disabled {
1117
+ .pelcro-root .pelcro-button-solid:disabled{
1033
1118
  --tw-text-opacity: 1;
1034
1119
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1035
1120
  }
1036
1121
 
1037
- .pelcro-root .pelcro-button-solid:hover {
1122
+ .pelcro-root .pelcro-button-solid:hover{
1038
1123
  --tw-shadow: 0 0 #0000;
1039
1124
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1040
1125
  }
1041
1126
 
1042
- .pelcro-root .pelcro-button-solid:focus {
1127
+ .pelcro-root .pelcro-button-solid:focus{
1043
1128
  outline: 2px solid transparent;
1044
1129
  outline-offset: 2px;
1045
1130
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -1053,11 +1138,11 @@ Add the correct display in Chrome and Safari.
1053
1138
  width: max-content;
1054
1139
  }
1055
1140
 
1056
- .pelcro-root .pelcro-button-outline:disabled {
1141
+ .pelcro-root .pelcro-button-outline:disabled{
1057
1142
  cursor: not-allowed;
1058
1143
  }
1059
1144
 
1060
- .pelcro-root .pelcro-button-outline {
1145
+ .pelcro-root .pelcro-button-outline{
1061
1146
  align-items: center;
1062
1147
  justify-content: center;
1063
1148
  justify-items: center;
@@ -1066,28 +1151,28 @@ Add the correct display in Chrome and Safari.
1066
1151
  border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1067
1152
  }
1068
1153
 
1069
- .pelcro-root .pelcro-button-outline:disabled {
1154
+ .pelcro-root .pelcro-button-outline:disabled{
1070
1155
  --tw-border-opacity: 1;
1071
1156
  border-color: rgba(107, 114, 128, var(--tw-border-opacity));
1072
1157
  }
1073
1158
 
1074
- .pelcro-root .pelcro-button-outline {
1159
+ .pelcro-root .pelcro-button-outline{
1075
1160
  background-color: transparent;
1076
1161
  }
1077
1162
 
1078
- .pelcro-root .pelcro-button-outline:hover {
1163
+ .pelcro-root .pelcro-button-outline:hover{
1079
1164
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
1080
1165
  }
1081
1166
 
1082
- .pelcro-root .pelcro-button-outline:focus {
1167
+ .pelcro-root .pelcro-button-outline:focus{
1083
1168
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
1084
1169
  }
1085
1170
 
1086
- .pelcro-root .pelcro-button-outline:disabled {
1171
+ .pelcro-root .pelcro-button-outline:disabled{
1087
1172
  background-color: transparent;
1088
1173
  }
1089
1174
 
1090
- .pelcro-root .pelcro-button-outline {
1175
+ .pelcro-root .pelcro-button-outline{
1091
1176
  padding-left: 1.5rem;
1092
1177
  padding-right: 1.5rem;
1093
1178
  padding-top: 0.5rem;
@@ -1098,27 +1183,27 @@ Add the correct display in Chrome and Safari.
1098
1183
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1099
1184
  }
1100
1185
 
1101
- .pelcro-root .pelcro-button-outline:hover {
1186
+ .pelcro-root .pelcro-button-outline:hover{
1102
1187
  --tw-text-opacity: 1;
1103
1188
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1104
1189
  }
1105
1190
 
1106
- .pelcro-root .pelcro-button-outline:focus {
1191
+ .pelcro-root .pelcro-button-outline:focus{
1107
1192
  --tw-text-opacity: 1;
1108
1193
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1109
1194
  }
1110
1195
 
1111
- .pelcro-root .pelcro-button-outline:disabled {
1196
+ .pelcro-root .pelcro-button-outline:disabled{
1112
1197
  --tw-text-opacity: 1;
1113
1198
  color: rgba(107, 114, 128, var(--tw-text-opacity));
1114
1199
  }
1115
1200
 
1116
- .pelcro-root .pelcro-button-outline:hover {
1201
+ .pelcro-root .pelcro-button-outline:hover{
1117
1202
  --tw-shadow: 0 0 #0000;
1118
1203
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1119
1204
  }
1120
1205
 
1121
- .pelcro-root .pelcro-button-outline:focus {
1206
+ .pelcro-root .pelcro-button-outline:focus{
1122
1207
  outline: 2px solid transparent;
1123
1208
  outline-offset: 2px;
1124
1209
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -1133,35 +1218,35 @@ Add the correct display in Chrome and Safari.
1133
1218
  width: 2rem;
1134
1219
  }
1135
1220
 
1136
- .pelcro-root .pelcro-button-icon:disabled {
1221
+ .pelcro-root .pelcro-button-icon:disabled{
1137
1222
  cursor: not-allowed;
1138
1223
  }
1139
1224
 
1140
- .pelcro-root .pelcro-button-icon {
1225
+ .pelcro-root .pelcro-button-icon{
1141
1226
  align-items: center;
1142
1227
  justify-content: center;
1143
1228
  border-radius: 9999px;
1144
1229
  border-width: 0px;
1145
1230
  }
1146
1231
 
1147
- .pelcro-root .pelcro-button-icon:hover {
1232
+ .pelcro-root .pelcro-button-icon:hover{
1148
1233
  --tw-bg-opacity: 1;
1149
1234
  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
1150
1235
  --tw-text-opacity: 1;
1151
1236
  color: rgba(75, 85, 99, var(--tw-text-opacity));
1152
1237
  }
1153
1238
 
1154
- .pelcro-root .pelcro-button-icon:disabled {
1239
+ .pelcro-root .pelcro-button-icon:disabled{
1155
1240
  --tw-text-opacity: 1;
1156
1241
  color: rgba(209, 213, 219, var(--tw-text-opacity));
1157
1242
  }
1158
1243
 
1159
- .pelcro-root .pelcro-button-icon:hover {
1244
+ .pelcro-root .pelcro-button-icon:hover{
1160
1245
  --tw-shadow: 0 0 #0000;
1161
1246
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1162
1247
  }
1163
1248
 
1164
- .pelcro-root .pelcro-button-icon:focus {
1249
+ .pelcro-root .pelcro-button-icon:focus{
1165
1250
  outline: 2px solid transparent;
1166
1251
  outline-offset: 2px;
1167
1252
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -1175,11 +1260,11 @@ Add the correct display in Chrome and Safari.
1175
1260
  width: max-content;
1176
1261
  }
1177
1262
 
1178
- .pelcro-root .pelcro-button-ghost:disabled {
1263
+ .pelcro-root .pelcro-button-ghost:disabled{
1179
1264
  cursor: not-allowed;
1180
1265
  }
1181
1266
 
1182
- .pelcro-root .pelcro-button-ghost {
1267
+ .pelcro-root .pelcro-button-ghost{
1183
1268
  align-items: center;
1184
1269
  justify-content: center;
1185
1270
  justify-items: center;
@@ -1188,21 +1273,21 @@ Add the correct display in Chrome and Safari.
1188
1273
  background-color: transparent;
1189
1274
  }
1190
1275
 
1191
- .pelcro-root .pelcro-button-ghost:hover {
1276
+ .pelcro-root .pelcro-button-ghost:hover{
1192
1277
  --tw-bg-opacity: 1;
1193
1278
  background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
1194
1279
  }
1195
1280
 
1196
- .pelcro-root .pelcro-button-ghost:focus {
1281
+ .pelcro-root .pelcro-button-ghost:focus{
1197
1282
  --tw-bg-opacity: 1;
1198
1283
  background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
1199
1284
  }
1200
1285
 
1201
- .pelcro-root .pelcro-button-ghost:disabled {
1286
+ .pelcro-root .pelcro-button-ghost:disabled{
1202
1287
  background-color: transparent;
1203
1288
  }
1204
1289
 
1205
- .pelcro-root .pelcro-button-ghost {
1290
+ .pelcro-root .pelcro-button-ghost{
1206
1291
  padding: 0.25rem;
1207
1292
  font-size: 0.75rem;
1208
1293
  line-height: 1rem;
@@ -1211,27 +1296,27 @@ Add the correct display in Chrome and Safari.
1211
1296
  color: rgba(107, 114, 128, var(--tw-text-opacity));
1212
1297
  }
1213
1298
 
1214
- .pelcro-root .pelcro-button-ghost:hover {
1299
+ .pelcro-root .pelcro-button-ghost:hover{
1215
1300
  --tw-text-opacity: 1;
1216
1301
  color: rgba(107, 114, 128, var(--tw-text-opacity));
1217
1302
  }
1218
1303
 
1219
- .pelcro-root .pelcro-button-ghost:focus {
1304
+ .pelcro-root .pelcro-button-ghost:focus{
1220
1305
  --tw-text-opacity: 1;
1221
1306
  color: rgba(107, 114, 128, var(--tw-text-opacity));
1222
1307
  }
1223
1308
 
1224
- .pelcro-root .pelcro-button-ghost:disabled {
1309
+ .pelcro-root .pelcro-button-ghost:disabled{
1225
1310
  --tw-text-opacity: 1;
1226
1311
  color: rgba(209, 213, 219, var(--tw-text-opacity));
1227
1312
  }
1228
1313
 
1229
- .pelcro-root .pelcro-button-ghost:hover {
1314
+ .pelcro-root .pelcro-button-ghost:hover{
1230
1315
  --tw-shadow: 0 0 #0000;
1231
1316
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1232
1317
  }
1233
1318
 
1234
- .pelcro-root .pelcro-button-ghost:focus {
1319
+ .pelcro-root .pelcro-button-ghost:focus{
1235
1320
  outline: 2px solid transparent;
1236
1321
  outline-offset: 2px;
1237
1322
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -1253,7 +1338,7 @@ Add the correct display in Chrome and Safari.
1253
1338
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1254
1339
  }
1255
1340
 
1256
- .pelcro-root .pelcro-link:hover {
1341
+ .pelcro-root .pelcro-link:hover{
1257
1342
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
1258
1343
  }
1259
1344
 
@@ -1271,35 +1356,35 @@ Add the correct display in Chrome and Safari.
1271
1356
  cursor: pointer;
1272
1357
  }
1273
1358
 
1274
- .pelcro-root .pelcro-radio:disabled {
1359
+ .pelcro-root .pelcro-radio:disabled{
1275
1360
  cursor: not-allowed;
1276
1361
  }
1277
1362
 
1278
- .pelcro-root .pelcro-radio {
1363
+ .pelcro-root .pelcro-radio{
1279
1364
  border-radius: 9999px;
1280
1365
  border-style: none;
1281
1366
  }
1282
1367
 
1283
- .pelcro-root .pelcro-radio:checked {
1368
+ .pelcro-root .pelcro-radio:checked{
1284
1369
  border-color: transparent;
1285
1370
  }
1286
1371
 
1287
- .pelcro-root .pelcro-radio {
1372
+ .pelcro-root .pelcro-radio{
1288
1373
  background-image: none;
1289
1374
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1290
1375
  }
1291
1376
 
1292
- .pelcro-root .pelcro-radio:disabled {
1377
+ .pelcro-root .pelcro-radio:disabled{
1293
1378
  --tw-text-opacity: 1;
1294
1379
  color: rgba(209, 213, 219, var(--tw-text-opacity));
1295
1380
  }
1296
1381
 
1297
- .pelcro-root .pelcro-radio:focus {
1382
+ .pelcro-root .pelcro-radio:focus{
1298
1383
  outline: 2px solid transparent;
1299
1384
  outline-offset: 2px;
1300
1385
  }
1301
1386
 
1302
- .pelcro-root .pelcro-radio {
1387
+ .pelcro-root .pelcro-radio{
1303
1388
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1304
1389
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1305
1390
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
@@ -1312,12 +1397,12 @@ Add the correct display in Chrome and Safari.
1312
1397
  }
1313
1398
 
1314
1399
  .pelcro-root .pelcro-alert-error {
1315
- margin-bottom: 0.5rem;
1400
+ margin-bottom: 1rem;
1316
1401
  display: flex;
1317
1402
  width: 100%;
1318
1403
  align-items: center;
1319
1404
  justify-content: space-between;
1320
- border-radius: 0.125rem;
1405
+ border-radius: 0.375rem;
1321
1406
  --tw-bg-opacity: 1;
1322
1407
  background-color: rgba(239, 190, 188, var(--tw-bg-opacity));
1323
1408
  padding-left: 1rem;
@@ -1332,12 +1417,12 @@ Add the correct display in Chrome and Safari.
1332
1417
  }
1333
1418
 
1334
1419
  .pelcro-root .pelcro-alert-success {
1335
- margin-bottom: 0.5rem;
1420
+ margin-bottom: 1rem;
1336
1421
  display: flex;
1337
1422
  width: 100%;
1338
1423
  align-items: center;
1339
1424
  justify-content: space-between;
1340
- border-radius: 0.125rem;
1425
+ border-radius: 0.375rem;
1341
1426
  --tw-bg-opacity: 1;
1342
1427
  background-color: rgba(167, 243, 208, var(--tw-bg-opacity));
1343
1428
  padding-left: 1rem;
@@ -1370,24 +1455,24 @@ Add the correct display in Chrome and Safari.
1370
1455
  background-color: transparent;
1371
1456
  }
1372
1457
 
1373
- .pelcro-root .pelcro-alert-close:hover {
1458
+ .pelcro-root .pelcro-alert-close:hover{
1374
1459
  background-color: transparent;
1375
1460
  }
1376
1461
 
1377
- .pelcro-root .pelcro-alert-close:focus {
1462
+ .pelcro-root .pelcro-alert-close:focus{
1378
1463
  background-color: transparent;
1379
1464
  }
1380
1465
 
1381
- .pelcro-root .pelcro-alert-close {
1466
+ .pelcro-root .pelcro-alert-close{
1382
1467
  fill: currentColor;
1383
1468
  color: currentColor;
1384
1469
  }
1385
1470
 
1386
- .pelcro-root .pelcro-alert-close:hover {
1471
+ .pelcro-root .pelcro-alert-close:hover{
1387
1472
  color: currentColor;
1388
1473
  }
1389
1474
 
1390
- .pelcro-root .pelcro-alert-close:focus {
1475
+ .pelcro-root .pelcro-alert-close:focus{
1391
1476
  color: currentColor;
1392
1477
  }
1393
1478
 
@@ -1411,13 +1496,13 @@ Add the correct display in Chrome and Safari.
1411
1496
  color: rgba(255, 255, 255, var(--tw-text-opacity));
1412
1497
  }
1413
1498
 
1414
- .pelcro-root .pelcro-notification-confirm > :not([hidden]) ~ :not([hidden]) {
1499
+ .pelcro-root .pelcro-notification-confirm > :not([hidden]) ~ :not([hidden]){
1415
1500
  --tw-space-x-reverse: 0;
1416
1501
  margin-right: calc(1rem * var(--tw-space-x-reverse));
1417
1502
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
1418
1503
  }
1419
1504
 
1420
- .pelcro-root .pelcro-notification-confirm {
1505
+ .pelcro-root .pelcro-notification-confirm{
1421
1506
  --tw-bg-opacity: 1;
1422
1507
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
1423
1508
  font-size: 0.875rem;
@@ -1425,13 +1510,13 @@ Add the correct display in Chrome and Safari.
1425
1510
  font-weight: 600;
1426
1511
  }
1427
1512
 
1428
- .pelcro-root .pelcro-notification-loading > :not([hidden]) ~ :not([hidden]) {
1513
+ .pelcro-root .pelcro-notification-loading > :not([hidden]) ~ :not([hidden]){
1429
1514
  --tw-space-x-reverse: 0;
1430
1515
  margin-right: calc(1rem * var(--tw-space-x-reverse));
1431
1516
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
1432
1517
  }
1433
1518
 
1434
- .pelcro-root .pelcro-notification-loading {
1519
+ .pelcro-root .pelcro-notification-loading{
1435
1520
  font-size: 0.875rem;
1436
1521
  line-height: 1.25rem;
1437
1522
  font-weight: 600;
@@ -1486,18 +1571,11 @@ Add the correct display in Chrome and Safari.
1486
1571
  display: none;
1487
1572
  }
1488
1573
 
1489
- .pelcro-root .pelcro-tooltip-container:hover .pelcro-tooltip, .pelcro-root .pelcro-tooltip:hover {
1574
+ .pelcro-root .pelcro-tooltip-container:hover .pelcro-tooltip, .pelcro-root .pelcro-tooltip:hover{
1490
1575
  z-index: 50;
1491
1576
  display: block;
1492
1577
  }
1493
1578
 
1494
- .pelcro-root .pelcro-vertical-separator {
1495
- display: inline-block;
1496
- --tw-bg-opacity: 1;
1497
- background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
1498
- width: 1px;
1499
- }
1500
-
1501
1579
  .pelcro-root .pelcro-shop-product-image {
1502
1580
  max-width: 13rem;
1503
1581
  }
@@ -1591,7 +1669,7 @@ Add the correct display in Chrome and Safari.
1591
1669
  height: 0.375rem;
1592
1670
  }
1593
1671
 
1594
- .pelcro-root input[type="range"]::-ms-fill-lower, .pelcro-root input[type="range"]::-ms-fill-upper {
1672
+ .pelcro-root input[type="range"]::-ms-fill-lower, .pelcro-root input[type="range"]::-ms-fill-upper{
1595
1673
  border-radius: 0.375rem;
1596
1674
  border-style: none;
1597
1675
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
@@ -1615,7 +1693,7 @@ Add the correct display in Chrome and Safari.
1615
1693
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1616
1694
  }
1617
1695
 
1618
- .pelcro-root input[type="range"]:focus::-ms-fill-lower, .pelcro-root input[type="range"]:focus::-ms-fill-upper {
1696
+ .pelcro-root input[type="range"]:focus::-ms-fill-lower, .pelcro-root input[type="range"]:focus::-ms-fill-upper{
1619
1697
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1620
1698
  }
1621
1699
 
@@ -1636,169 +1714,214 @@ Add the correct display in Chrome and Safari.
1636
1714
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
1637
1715
  }
1638
1716
 
1639
- .pelcro-root .pelcro-select-plan-radio {
1640
- margin-top: 0.4rem;
1717
+ .pelcro-root .pelcro-product {
1718
+ display: flex !important;
1641
1719
  }
1642
1720
 
1643
- .pelcro-root .pelcro-product:before {
1721
+ .pelcro-root .productTabs:before {
1644
1722
  content: "";
1723
+ width: calc(100% - 5.5rem);
1724
+ left: 2.75rem;
1645
1725
  position: absolute;
1646
- top: 0px;
1647
- left: 0px;
1648
- height: 0.25rem;
1649
- width: 100%;
1650
- background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
1726
+ bottom: 0.125rem;
1727
+ height: 1px;
1728
+ --tw-bg-opacity: 1;
1729
+ background-color: rgba(209, 213, 219, var(--tw-bg-opacity));
1651
1730
  }
1652
1731
 
1653
- .pelcro-root .productTabs .tabs::-webkit-scrollbar {
1654
- display: none;
1732
+ .pelcro-root .selectedProduct img {
1733
+ max-width: 150px;
1734
+ height: auto;
1655
1735
  }
1656
1736
 
1657
- .pelcro-root .productTabs .tabs {
1658
- -ms-overflow-style: none;
1659
- scrollbar-width: none;
1737
+ .pelcro-root .pelcro-select-plan-wrapper:hover, .pelcro-root .pelcro-select-product-wrapper:hover{
1738
+ border-width: 2px;
1739
+ border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
1660
1740
  }
1661
1741
 
1662
- .pelcro-root .productTabs .tabs li:first-child {
1663
- margin-left: auto;
1742
+ .pelcro-root .pelcro-select-plan-wrapper:hover,
1743
+ .pelcro-root .pelcro-select-product-wrapper:hover{
1744
+ transform: scale(1.05);
1745
+ transition: all 0.2s ease-out;
1746
+ box-shadow: 0px 4px 8px rgba(38, 38, 38, 0.2);
1664
1747
  }
1665
1748
 
1666
- .pelcro-root .productTabs .tabs li:last-child {
1667
- margin-right: auto;
1749
+ .pelcro-root .pelcro-select-plan-wrapper,
1750
+ .pelcro-root .pelcro-select-product-wrapper {
1751
+ transition: all 0.2s ease-in-out;
1668
1752
  }
1669
1753
 
1670
- .pelcro-root .productTabs .tabs li#activeTab button {
1671
- color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
1754
+ .pelcro-root .loginOptions.threeColumns {
1755
+ display: flex;
1756
+ flex-wrap: wrap;
1757
+ justify-content: center;
1672
1758
  }
1673
1759
 
1674
- .pelcro-root .productTabs .tabs li#activeTab:after {
1675
- content: "";
1676
- position: absolute;
1677
- bottom: 0px;
1678
- left: 0px;
1679
- display: block;
1680
- height: 0.25rem;
1681
- width: 100%;
1682
- background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
1760
+ .pelcro-root .loginOptions.threeColumns li {
1761
+ flex: 1;
1762
+ min-width: 140px;
1763
+ margin-bottom: 10px;
1683
1764
  }
1684
1765
 
1685
- .pelcro-root .selectedProduct img {
1686
- max-width: 150px;
1687
- height: auto;
1766
+ .pelcro-root .loginOptions.threeColumns li:first-child {
1767
+ margin-right: 10px;
1768
+ }
1769
+
1770
+ .pelcro-root
1771
+ .loginOptions.threeColumns
1772
+ li:nth-child(2):not(:last-child) {
1773
+ margin-right: 10px;
1774
+ }
1775
+
1776
+ .pelcro-root .loginOptions.twoColumns {
1777
+ display: grid;
1778
+ grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
1779
+ gap: 10px;
1688
1780
  }
1689
1781
 
1690
1782
  .pelcro-user-profile-picture:hover {
1691
1783
  filter: brightness(0.8);
1692
1784
  }
1693
1785
 
1786
+ #pelcro-view-dashboard-submenus {
1787
+ /* From https://css.glass */
1788
+ background: rgba(255, 255, 255, 0.12);
1789
+ /* border-radius: 16px; */
1790
+ /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */
1791
+ backdrop-filter: blur(3.5px);
1792
+ -webkit-backdrop-filter: blur(3.5px);
1793
+ }
1794
+
1694
1795
  /* used by multiple input sub-components */
1695
1796
 
1696
- .pelcro-root .alice-carousel {
1697
- padding-left: 5rem;
1698
- padding-right: 5rem;
1797
+ /* Slider */
1798
+
1799
+ .pelcro-root .slick-slider {
1800
+ position: relative;
1801
+ display: block;
1802
+ box-sizing: border-box;
1803
+ -webkit-user-select: none;
1804
+ user-select: none;
1805
+ touch-action: pan-y;
1699
1806
  }
1700
1807
 
1701
- .pelcro-root .alice-carousel__stage {
1702
- display: flex;
1808
+ .pelcro-root .slick-list {
1809
+ position: relative;
1810
+ display: block;
1811
+ overflow: hidden;
1812
+ padding: 0;
1813
+ padding-top: 0.75rem;
1814
+ padding-bottom: 0.75rem;
1815
+ /* margin: 0 -10px; */
1703
1816
  }
1704
1817
 
1705
- .pelcro-root .alice-carousel__stage-item {
1706
- flex: 1 0 auto;
1707
- height: auto;
1818
+ .pelcro-root .slick-list:focus {
1819
+ outline: none;
1708
1820
  }
1709
1821
 
1710
- .pelcro-root .alice-carousel__next-btn,
1711
- .pelcro-root .alice-carousel__prev-btn {
1712
- position: absolute;
1713
- top: 50%;
1714
- transform: translateY(-50%);
1715
- width: auto;
1822
+ .pelcro-root .slick-list.dragging {
1823
+ cursor: pointer;
1716
1824
  }
1717
1825
 
1718
- .pelcro-root .alice-carousel__next-btn {
1719
- right: 0;
1826
+ .pelcro-root .slick-slider .slick-track,
1827
+ .pelcro-root .slick-slider .slick-list {
1828
+ transform: translate3d(0, 0, 0);
1720
1829
  }
1721
1830
 
1722
- .pelcro-root .alice-carousel__prev-btn {
1831
+ .pelcro-root .slick-track {
1832
+ position: relative;
1833
+ top: 0;
1723
1834
  left: 0;
1835
+ display: flex;
1836
+ align-items: stretch;
1724
1837
  }
1725
1838
 
1726
- .pelcro-root .alice-carousel__next-btn-item span,
1727
- .pelcro-root .alice-carousel__prev-btn-item span {
1728
- width: 3.5rem;
1729
- height: 3.5rem;
1730
- border-radius: 999999px;
1731
- display: inline-flex;
1732
- align-items: center;
1733
- justify-content: center;
1734
- background-color: black;
1735
- color: white;
1839
+ .pelcro-root .slick-track:before,
1840
+ .pelcro-root .slick-track:after {
1841
+ display: table;
1842
+ content: "";
1736
1843
  }
1737
1844
 
1738
- .pelcro-root .alice-carousel__next-btn-item span {
1739
- padding-left: 5px;
1845
+ .pelcro-root .slick-track:after {
1846
+ clear: both;
1740
1847
  }
1741
1848
 
1742
- .pelcro-root .alice-carousel__prev-btn-item span {
1743
- padding-right: 5px;
1849
+ .pelcro-root .slick-loading .slick-track {
1850
+ visibility: hidden;
1744
1851
  }
1745
1852
 
1746
- .pelcro-root .alice-carousel__next-btn-item [data-area]::after,
1747
- .pelcro-root .alice-carousel__prev-btn-item [data-area]::after {
1748
- height: 28px;
1749
- width: 28px;
1750
- line-height: 1;
1751
- display: inline-flex;
1752
- align-items: center;
1753
- justify-content: center;
1853
+ .pelcro-root .slick-slide {
1854
+ display: flex !important;
1855
+ align-self: stretch;
1856
+ height: unset;
1857
+ margin: 0 10px;
1754
1858
  }
1755
1859
 
1756
- .pelcro-root .alice-carousel__stage-item {
1757
- padding-left: 1rem;
1758
- padding-right: 1rem;
1860
+ .pelcro-root .slick-slide > div {
1861
+ display: flex;
1862
+ align-self: stretch;
1863
+ width: 100%;
1864
+ height: 100%;
1759
1865
  }
1760
1866
 
1761
- .pelcro-root .alice-carousel__dots {
1762
- margin-top: 2rem;
1763
- display: flex;
1764
- align-items: center;
1765
- justify-content: center;
1867
+ .pelcro-root .slick-slide img {
1868
+ display: block;
1766
1869
  }
1767
1870
 
1768
- .pelcro-root .alice-carousel__dots-item {
1769
- width: 0.75rem;
1770
- height: 0.75rem;
1771
- background-color: #d1d5db;
1871
+ .pelcro-root .slick-slide.slick-loading img {
1872
+ display: none;
1772
1873
  }
1773
1874
 
1774
- .pelcro-root
1775
- .alice-carousel__dots-item:not(.__custom):not(:last-child) {
1776
- margin-right: 0.5rem;
1875
+ .pelcro-root .slick-slide.dragging img {
1876
+ pointer-events: none;
1777
1877
  }
1778
1878
 
1779
- .pelcro-root .alice-carousel__dots-item:not(.__custom):hover,
1780
- .alice-carousel__dots-item:not(.__custom).__active {
1781
- background-color: black;
1879
+ .pelcro-root .slick-initialized .slick-slide {
1880
+ display: block;
1782
1881
  }
1783
1882
 
1784
- .pelcro-root .alice-carousel__next-btn-item [data-area]::after {
1785
- content: url("/assets/arrow-thin-right.svg");
1883
+ .pelcro-root .slick-loading .slick-slide {
1884
+ visibility: hidden;
1786
1885
  }
1787
1886
 
1788
- .pelcro-root .alice-carousel__prev-btn-item [data-area]::after {
1789
- content: url("/assets/arrow-thin-left.svg");
1887
+ .pelcro-root .slick-vertical .slick-slide {
1888
+ display: block;
1889
+ height: auto;
1890
+ border: 1px solid transparent;
1790
1891
  }
1791
1892
 
1792
- @media (max-width: 1024px) {
1793
- .pelcro-root .alice-carousel__prev-btn,
1794
- .pelcro-root .alice-carousel__next-btn {
1795
- display: none;
1796
- }
1893
+ .pelcro-root .slick-arrow.slick-hidden {
1894
+ display: none;
1895
+ }
1797
1896
 
1798
- .pelcro-root .alice-carousel {
1799
- padding-right: 0;
1800
- padding-left: 0;
1801
- }
1897
+ .pelcro-root .slick-disabled {
1898
+ opacity: 0;
1899
+ cursor: auto;
1900
+ }
1901
+
1902
+ .pelcro-root .slick-dots {
1903
+ margin-top: 20px;
1904
+ display: flex !important;
1905
+ align-items: center;
1906
+ justify-content: center;
1907
+ flex-wrap: wrap;
1908
+ }
1909
+
1910
+ .pelcro-root .slick-dots li {
1911
+ margin: 0 2px;
1912
+ }
1913
+
1914
+ .pelcro-root .slick-dots li.slick-active span {
1915
+ border-color: grey;
1916
+ background-color: hsl(
1917
+ var(--plc-primary-hue),
1918
+ var(--plc-primary-saturation),
1919
+ var(--plc-primary-lightness)
1920
+ );
1921
+ }
1922
+
1923
+ .pelcro-root .slick-arrow {
1924
+ outline: none !important;
1802
1925
  }
1803
1926
 
1804
1927
  /*
@@ -1875,507 +1998,611 @@ in order to scope selectors under pelcro-root
1875
1998
  border-right: 0;
1876
1999
  }
1877
2000
 
2001
+ apple-pay-button {
2002
+ --apple-pay-button-width: 100%;
2003
+ --apple-pay-button-height: 48px;
2004
+ --apple-pay-button-border-radius: 0.25rem;
2005
+ --apple-pay-button-padding: 0px 0px;
2006
+ --apple-pay-button-box-sizing: border-box;
2007
+ }
2008
+
1878
2009
  /* utilities */
1879
2010
 
1880
- .pelcro-root .plc-pointer-events-none {
2011
+ .pelcro-root .plc-pointer-events-none{
1881
2012
  pointer-events: none;
1882
2013
  }
1883
2014
 
1884
- .pelcro-root .plc-fixed {
2015
+ .pelcro-root .plc-fixed{
1885
2016
  position: fixed;
1886
2017
  }
1887
2018
 
1888
- .pelcro-root .plc-absolute {
2019
+ .pelcro-root .plc-absolute{
1889
2020
  position: absolute;
1890
2021
  }
1891
2022
 
1892
- .pelcro-root .plc-relative {
2023
+ .pelcro-root .plc-relative{
1893
2024
  position: relative;
1894
2025
  }
1895
2026
 
1896
- .pelcro-root .plc-inset-0 {
2027
+ .pelcro-root .plc-inset-0{
1897
2028
  top: 0px;
1898
2029
  right: 0px;
1899
2030
  bottom: 0px;
1900
2031
  left: 0px;
1901
2032
  }
1902
2033
 
1903
- .pelcro-root .plc-inset-y-0 {
2034
+ .pelcro-root .plc-inset-y-0{
1904
2035
  top: 0px;
1905
2036
  bottom: 0px;
1906
2037
  }
1907
2038
 
1908
- .pelcro-root .plc-top-0 {
2039
+ .pelcro-root .plc-top-0{
1909
2040
  top: 0px;
1910
2041
  }
1911
2042
 
1912
- .pelcro-root .plc-top-1 {
2043
+ .pelcro-root .plc-top-1{
1913
2044
  top: 0.25rem;
1914
2045
  }
1915
2046
 
1916
- .pelcro-root .plc-top-5 {
2047
+ .pelcro-root .plc-top-2{
2048
+ top: 0.5rem;
2049
+ }
2050
+
2051
+ .pelcro-root .plc-top-4{
2052
+ top: 1rem;
2053
+ }
2054
+
2055
+ .pelcro-root .plc-top-5{
1917
2056
  top: 1.25rem;
1918
2057
  }
1919
2058
 
1920
- .pelcro-root .plc-top-7 {
1921
- top: 1.75rem;
2059
+ .pelcro-root .plc-top-6{
2060
+ top: 1.5rem;
1922
2061
  }
1923
2062
 
1924
- .pelcro-root .plc-top-24 {
2063
+ .pelcro-root .plc-top-24{
1925
2064
  top: 6rem;
1926
2065
  }
1927
2066
 
1928
- .pelcro-root .plc-top-1\.5 {
2067
+ .pelcro-root .plc-top-1\.5{
1929
2068
  top: 0.375rem;
1930
2069
  }
1931
2070
 
1932
- .pelcro-root .plc-top-1\/2 {
2071
+ .pelcro-root .plc--top-1{
2072
+ top: -0.25rem;
2073
+ }
2074
+
2075
+ .pelcro-root .plc--top-3{
2076
+ top: -0.75rem;
2077
+ }
2078
+
2079
+ .pelcro-root .plc-top-1\/2{
1933
2080
  top: 50%;
1934
2081
  }
1935
2082
 
1936
- .pelcro-root .plc-right-0 {
2083
+ .pelcro-root .plc-right-0{
1937
2084
  right: 0px;
1938
2085
  }
1939
2086
 
1940
- .pelcro-root .plc-right-1 {
2087
+ .pelcro-root .plc-right-1{
1941
2088
  right: 0.25rem;
1942
2089
  }
1943
2090
 
1944
- .pelcro-root .plc-right-2 {
2091
+ .pelcro-root .plc-right-2{
1945
2092
  right: 0.5rem;
1946
2093
  }
1947
2094
 
1948
- .pelcro-root .plc-right-4 {
1949
- right: 1rem;
2095
+ .pelcro-root .plc-right-3{
2096
+ right: 0.75rem;
1950
2097
  }
1951
2098
 
1952
- .pelcro-root .plc-right-10 {
2099
+ .pelcro-root .plc-right-5{
2100
+ right: 1.25rem;
2101
+ }
2102
+
2103
+ .pelcro-root .plc-right-10{
1953
2104
  right: 2.5rem;
1954
2105
  }
1955
2106
 
1956
- .pelcro-root .plc-bottom-0 {
2107
+ .pelcro-root .plc--right-14{
2108
+ right: -3.5rem;
2109
+ }
2110
+
2111
+ .pelcro-root .plc-bottom-0{
1957
2112
  bottom: 0px;
1958
2113
  }
1959
2114
 
1960
- .pelcro-root .plc-bottom-4 {
2115
+ .pelcro-root .plc-bottom-4{
1961
2116
  bottom: 1rem;
1962
2117
  }
1963
2118
 
1964
- .pelcro-root .plc-left-0 {
2119
+ .pelcro-root .plc-left-0{
1965
2120
  left: 0px;
1966
2121
  }
1967
2122
 
1968
- .pelcro-root .plc-left-5 {
1969
- left: 1.25rem;
2123
+ .pelcro-root .plc-left-4{
2124
+ left: 1rem;
2125
+ }
2126
+
2127
+ .pelcro-root .plc-left-6{
2128
+ left: 1.5rem;
2129
+ }
2130
+
2131
+ .pelcro-root .plc--left-14{
2132
+ left: -3.5rem;
1970
2133
  }
1971
2134
 
1972
- .pelcro-root .plc-z-max {
2135
+ .pelcro-root .plc-z-max{
1973
2136
  z-index: 999999;
1974
2137
  }
1975
2138
 
1976
- .pelcro-root .plc-order-1 {
2139
+ .pelcro-root .plc-order-1{
1977
2140
  order: 1;
1978
2141
  }
1979
2142
 
1980
- .pelcro-root .plc-order-2 {
2143
+ .pelcro-root .plc-order-2{
1981
2144
  order: 2;
1982
2145
  }
1983
2146
 
1984
- .pelcro-root .plc-m-0 {
2147
+ .pelcro-root .plc-m-0{
1985
2148
  margin: 0px;
1986
2149
  }
1987
2150
 
1988
- .pelcro-root .plc-m-3 {
2151
+ .pelcro-root .plc-m-1{
2152
+ margin: 0.25rem;
2153
+ }
2154
+
2155
+ .pelcro-root .plc-m-3{
1989
2156
  margin: 0.75rem;
1990
2157
  }
1991
2158
 
1992
- .pelcro-root .plc-m-auto {
2159
+ .pelcro-root .plc-m-auto{
1993
2160
  margin: auto;
1994
2161
  }
1995
2162
 
1996
- .pelcro-root .plc-mx-4 {
1997
- margin-left: 1rem;
1998
- margin-right: 1rem;
2163
+ .pelcro-root .plc-m-0\.5{
2164
+ margin: 0.125rem;
1999
2165
  }
2000
2166
 
2001
- .pelcro-root .plc-mx-auto {
2167
+ .pelcro-root .plc-mx-auto{
2002
2168
  margin-left: auto;
2003
2169
  margin-right: auto;
2004
2170
  }
2005
2171
 
2006
- .pelcro-root .plc-my-2 {
2172
+ .pelcro-root .plc-my-2{
2007
2173
  margin-top: 0.5rem;
2008
2174
  margin-bottom: 0.5rem;
2009
2175
  }
2010
2176
 
2011
- .pelcro-root .plc-my-4 {
2177
+ .pelcro-root .plc-my-4{
2012
2178
  margin-top: 1rem;
2013
2179
  margin-bottom: 1rem;
2014
2180
  }
2015
2181
 
2016
- .pelcro-root .plc-my-5 {
2182
+ .pelcro-root .plc-my-5{
2017
2183
  margin-top: 1.25rem;
2018
2184
  margin-bottom: 1.25rem;
2019
2185
  }
2020
2186
 
2021
- .pelcro-root .plc-my-20 {
2022
- margin-top: 5rem;
2023
- margin-bottom: 5rem;
2187
+ .pelcro-root .plc-my-11{
2188
+ margin-top: 2.75rem;
2189
+ margin-bottom: 2.75rem;
2190
+ }
2191
+
2192
+ .pelcro-root .plc-my-auto{
2193
+ margin-top: auto;
2194
+ margin-bottom: auto;
2024
2195
  }
2025
2196
 
2026
- .pelcro-root .plc-mt-1 {
2197
+ .pelcro-root .plc-mt-1{
2027
2198
  margin-top: 0.25rem;
2028
2199
  }
2029
2200
 
2030
- .pelcro-root .plc-mt-2 {
2201
+ .pelcro-root .plc-mt-2{
2031
2202
  margin-top: 0.5rem;
2032
2203
  }
2033
2204
 
2034
- .pelcro-root .plc-mt-3 {
2205
+ .pelcro-root .plc-mt-3{
2035
2206
  margin-top: 0.75rem;
2036
2207
  }
2037
2208
 
2038
- .pelcro-root .plc-mt-4 {
2209
+ .pelcro-root .plc-mt-4{
2039
2210
  margin-top: 1rem;
2040
2211
  }
2041
2212
 
2042
- .pelcro-root .plc-mt-5 {
2213
+ .pelcro-root .plc-mt-5{
2043
2214
  margin-top: 1.25rem;
2044
2215
  }
2045
2216
 
2046
- .pelcro-root .plc-mt-6 {
2217
+ .pelcro-root .plc-mt-6{
2047
2218
  margin-top: 1.5rem;
2048
2219
  }
2049
2220
 
2050
- .pelcro-root .plc-mt-8 {
2051
- margin-top: 2rem;
2052
- }
2053
-
2054
- .pelcro-root .plc-mt-auto {
2221
+ .pelcro-root .plc-mt-auto{
2055
2222
  margin-top: auto;
2056
2223
  }
2057
2224
 
2058
- .pelcro-root .plc--mt-8 {
2225
+ .pelcro-root .plc--mt-8{
2059
2226
  margin-top: -2rem;
2060
2227
  }
2061
2228
 
2062
- .pelcro-root .plc-mr-1 {
2229
+ .pelcro-root .plc-mr-1{
2063
2230
  margin-right: 0.25rem;
2064
2231
  }
2065
2232
 
2066
- .pelcro-root .plc-mr-2 {
2233
+ .pelcro-root .plc-mr-2{
2067
2234
  margin-right: 0.5rem;
2068
2235
  }
2069
2236
 
2070
- .pelcro-root .plc-mr-6 {
2237
+ .pelcro-root .plc-mr-4{
2238
+ margin-right: 1rem;
2239
+ }
2240
+
2241
+ .pelcro-root .plc-mr-6{
2071
2242
  margin-right: 1.5rem;
2072
2243
  }
2073
2244
 
2074
- .pelcro-root .plc-mb-1 {
2245
+ .pelcro-root .plc-mr-auto{
2246
+ margin-right: auto;
2247
+ }
2248
+
2249
+ .pelcro-root .plc-mb-1{
2075
2250
  margin-bottom: 0.25rem;
2076
2251
  }
2077
2252
 
2078
- .pelcro-root .plc-mb-2 {
2253
+ .pelcro-root .plc-mb-2{
2079
2254
  margin-bottom: 0.5rem;
2080
2255
  }
2081
2256
 
2082
- .pelcro-root .plc-mb-3 {
2257
+ .pelcro-root .plc-mb-3{
2083
2258
  margin-bottom: 0.75rem;
2084
2259
  }
2085
2260
 
2086
- .pelcro-root .plc-mb-4 {
2261
+ .pelcro-root .plc-mb-4{
2087
2262
  margin-bottom: 1rem;
2088
2263
  }
2089
2264
 
2090
- .pelcro-root .plc-mb-6 {
2265
+ .pelcro-root .plc-mb-6{
2091
2266
  margin-bottom: 1.5rem;
2092
2267
  }
2093
2268
 
2094
- .pelcro-root .plc-mb-8 {
2269
+ .pelcro-root .plc-mb-8{
2095
2270
  margin-bottom: 2rem;
2096
2271
  }
2097
2272
 
2098
- .pelcro-root .plc-mb-9 {
2273
+ .pelcro-root .plc-mb-9{
2099
2274
  margin-bottom: 2.25rem;
2100
2275
  }
2101
2276
 
2102
- .pelcro-root .plc-ml-0 {
2277
+ .pelcro-root .plc-mb-10{
2278
+ margin-bottom: 2.5rem;
2279
+ }
2280
+
2281
+ .pelcro-root .plc-ml-0{
2103
2282
  margin-left: 0px;
2104
2283
  }
2105
2284
 
2106
- .pelcro-root .plc-ml-1 {
2285
+ .pelcro-root .plc-ml-1{
2107
2286
  margin-left: 0.25rem;
2108
2287
  }
2109
2288
 
2110
- .pelcro-root .plc-ml-2 {
2289
+ .pelcro-root .plc-ml-2{
2111
2290
  margin-left: 0.5rem;
2112
2291
  }
2113
2292
 
2114
- .pelcro-root .plc-ml-3 {
2293
+ .pelcro-root .plc-ml-3{
2115
2294
  margin-left: 0.75rem;
2116
2295
  }
2117
2296
 
2118
- .pelcro-root .plc-ml-4 {
2297
+ .pelcro-root .plc-ml-4{
2119
2298
  margin-left: 1rem;
2120
2299
  }
2121
2300
 
2122
- .pelcro-root .plc--ml-2 {
2301
+ .pelcro-root .plc-ml-11{
2302
+ margin-left: 2.75rem;
2303
+ }
2304
+
2305
+ .pelcro-root .plc--ml-2{
2123
2306
  margin-left: -0.5rem;
2124
2307
  }
2125
2308
 
2126
- .pelcro-root .last\:plc-mb-0:last-child {
2309
+ .pelcro-root .last\:plc-mb-0:last-child{
2127
2310
  margin-bottom: 0px;
2128
2311
  }
2129
2312
 
2130
- .pelcro-root .plc-block {
2313
+ .pelcro-root .plc-block{
2131
2314
  display: block;
2132
2315
  }
2133
2316
 
2134
- .pelcro-root .plc-inline-block {
2317
+ .pelcro-root .plc-inline-block{
2135
2318
  display: inline-block;
2136
2319
  }
2137
2320
 
2138
- .pelcro-root .plc-flex {
2321
+ .pelcro-root .plc-inline{
2322
+ display: inline;
2323
+ }
2324
+
2325
+ .pelcro-root .plc-flex{
2139
2326
  display: flex;
2140
2327
  }
2141
2328
 
2142
- .pelcro-root .plc-inline-flex {
2329
+ .pelcro-root .plc-inline-flex{
2143
2330
  display: inline-flex;
2144
2331
  }
2145
2332
 
2146
- .pelcro-root .plc-grid {
2333
+ .pelcro-root .plc-grid{
2147
2334
  display: grid;
2148
2335
  }
2149
2336
 
2150
- .pelcro-root .plc-hidden {
2337
+ .pelcro-root .plc-hidden{
2151
2338
  display: none;
2152
2339
  }
2153
2340
 
2154
- .pelcro-root .plc-h-4 {
2341
+ .pelcro-root .plc-h-3{
2342
+ height: 0.75rem;
2343
+ }
2344
+
2345
+ .pelcro-root .plc-h-4{
2155
2346
  height: 1rem;
2156
2347
  }
2157
2348
 
2158
- .pelcro-root .plc-h-5 {
2349
+ .pelcro-root .plc-h-5{
2159
2350
  height: 1.25rem;
2160
2351
  }
2161
2352
 
2162
- .pelcro-root .plc-h-6 {
2353
+ .pelcro-root .plc-h-6{
2163
2354
  height: 1.5rem;
2164
2355
  }
2165
2356
 
2166
- .pelcro-root .plc-h-7 {
2357
+ .pelcro-root .plc-h-7{
2167
2358
  height: 1.75rem;
2168
2359
  }
2169
2360
 
2170
- .pelcro-root .plc-h-8 {
2361
+ .pelcro-root .plc-h-8{
2171
2362
  height: 2rem;
2172
2363
  }
2173
2364
 
2174
- .pelcro-root .plc-h-9 {
2365
+ .pelcro-root .plc-h-9{
2175
2366
  height: 2.25rem;
2176
2367
  }
2177
2368
 
2178
- .pelcro-root .plc-h-10 {
2369
+ .pelcro-root .plc-h-10{
2179
2370
  height: 2.5rem;
2180
2371
  }
2181
2372
 
2182
- .pelcro-root .plc-h-12 {
2373
+ .pelcro-root .plc-h-11{
2374
+ height: 2.75rem;
2375
+ }
2376
+
2377
+ .pelcro-root .plc-h-12{
2183
2378
  height: 3rem;
2184
2379
  }
2185
2380
 
2186
- .pelcro-root .plc-h-20 {
2381
+ .pelcro-root .plc-h-20{
2187
2382
  height: 5rem;
2188
2383
  }
2189
2384
 
2190
- .pelcro-root .plc-h-28 {
2385
+ .pelcro-root .plc-h-28{
2191
2386
  height: 7rem;
2192
2387
  }
2193
2388
 
2194
- .pelcro-root .plc-h-32 {
2389
+ .pelcro-root .plc-h-32{
2195
2390
  height: 8rem;
2196
2391
  }
2197
2392
 
2198
- .pelcro-root .plc-h-36 {
2393
+ .pelcro-root .plc-h-36{
2199
2394
  height: 9rem;
2200
2395
  }
2201
2396
 
2202
- .pelcro-root .plc-h-52 {
2397
+ .pelcro-root .plc-h-40{
2398
+ height: 10rem;
2399
+ }
2400
+
2401
+ .pelcro-root .plc-h-52{
2203
2402
  height: 13rem;
2204
2403
  }
2205
2404
 
2206
- .pelcro-root .plc-h-auto {
2405
+ .pelcro-root .plc-h-auto{
2207
2406
  height: auto;
2208
2407
  }
2209
2408
 
2210
- .pelcro-root .plc-h-full {
2409
+ .pelcro-root .plc-h-full{
2211
2410
  height: 100%;
2212
2411
  }
2213
2412
 
2214
- .pelcro-root .plc-max-h-0 {
2413
+ .pelcro-root .plc-max-h-0{
2215
2414
  max-height: 0px;
2216
2415
  }
2217
2416
 
2218
- .pelcro-root .plc-max-h-14 {
2417
+ .pelcro-root .plc-max-h-14{
2219
2418
  max-height: 3.5rem;
2220
2419
  }
2221
2420
 
2222
- .pelcro-root .plc-max-h-80 {
2421
+ .pelcro-root .plc-max-h-48{
2422
+ max-height: 12rem;
2423
+ }
2424
+
2425
+ .pelcro-root .plc-max-h-80{
2223
2426
  max-height: 20rem;
2224
2427
  }
2225
2428
 
2226
- .pelcro-root .plc-max-h-full {
2429
+ .pelcro-root .plc-max-h-full{
2227
2430
  max-height: 100%;
2228
2431
  }
2229
2432
 
2230
- .pelcro-root .plc-min-h-12 {
2231
- min-height: 3rem;
2433
+ .pelcro-root .plc-min-h-0{
2434
+ min-height: 0px;
2232
2435
  }
2233
2436
 
2234
- .pelcro-root .plc-w-3 {
2437
+ .pelcro-root .plc-min-h-12{
2438
+ min-height: 3rem;
2439
+ }
2440
+
2441
+ .pelcro-root .plc-min-h-14{
2442
+ min-height: 5rem;
2443
+ }
2444
+
2445
+ .pelcro-root .plc-min-h-16{
2446
+ min-height: 6rem;
2447
+ }
2448
+
2449
+ .pelcro-root .plc-min-h-card{
2450
+ min-height: 24.75rem;
2451
+ }
2452
+
2453
+ .pelcro-root .plc-w-3{
2235
2454
  width: 0.75rem;
2236
2455
  }
2237
2456
 
2238
- .pelcro-root .plc-w-4 {
2457
+ .pelcro-root .plc-w-4{
2239
2458
  width: 1rem;
2240
2459
  }
2241
2460
 
2242
- .pelcro-root .plc-w-5 {
2461
+ .pelcro-root .plc-w-5{
2243
2462
  width: 1.25rem;
2244
2463
  }
2245
2464
 
2246
- .pelcro-root .plc-w-6 {
2465
+ .pelcro-root .plc-w-6{
2247
2466
  width: 1.5rem;
2248
2467
  }
2249
2468
 
2250
- .pelcro-root .plc-w-7 {
2469
+ .pelcro-root .plc-w-7{
2251
2470
  width: 1.75rem;
2252
2471
  }
2253
2472
 
2254
- .pelcro-root .plc-w-8 {
2473
+ .pelcro-root .plc-w-8{
2255
2474
  width: 2rem;
2256
2475
  }
2257
2476
 
2258
- .pelcro-root .plc-w-9 {
2477
+ .pelcro-root .plc-w-9{
2259
2478
  width: 2.25rem;
2260
2479
  }
2261
2480
 
2262
- .pelcro-root .plc-w-10 {
2481
+ .pelcro-root .plc-w-10{
2263
2482
  width: 2.5rem;
2264
2483
  }
2265
2484
 
2266
- .pelcro-root .plc-w-12 {
2485
+ .pelcro-root .plc-w-11{
2486
+ width: 2.75rem;
2487
+ }
2488
+
2489
+ .pelcro-root .plc-w-12{
2267
2490
  width: 3rem;
2268
2491
  }
2269
2492
 
2270
- .pelcro-root .plc-w-16 {
2493
+ .pelcro-root .plc-w-16{
2271
2494
  width: 4rem;
2272
2495
  }
2273
2496
 
2274
- .pelcro-root .plc-w-20 {
2497
+ .pelcro-root .plc-w-20{
2275
2498
  width: 5rem;
2276
2499
  }
2277
2500
 
2278
- .pelcro-root .plc-w-24 {
2501
+ .pelcro-root .plc-w-24{
2279
2502
  width: 6rem;
2280
2503
  }
2281
2504
 
2282
- .pelcro-root .plc-w-32 {
2505
+ .pelcro-root .plc-w-32{
2283
2506
  width: 8rem;
2284
2507
  }
2285
2508
 
2286
- .pelcro-root .plc-w-36 {
2509
+ .pelcro-root .plc-w-36{
2287
2510
  width: 9rem;
2288
2511
  }
2289
2512
 
2290
- .pelcro-root .plc-w-56 {
2513
+ .pelcro-root .plc-w-56{
2291
2514
  width: 14rem;
2292
2515
  }
2293
2516
 
2294
- .pelcro-root .plc-w-auto {
2295
- width: auto;
2517
+ .pelcro-root .plc-w-1\/2{
2518
+ width: 50%;
2296
2519
  }
2297
2520
 
2298
- .pelcro-root .plc-w-1\/2 {
2299
- width: 50%;
2521
+ .pelcro-root .plc-w-1\/3{
2522
+ width: 33.333333%;
2300
2523
  }
2301
2524
 
2302
- .pelcro-root .plc-w-1\/4 {
2525
+ .pelcro-root .plc-w-1\/4{
2303
2526
  width: 25%;
2304
2527
  }
2305
2528
 
2306
- .pelcro-root .plc-w-1\/5 {
2529
+ .pelcro-root .plc-w-3\/4{
2530
+ width: 75%;
2531
+ }
2532
+
2533
+ .pelcro-root .plc-w-1\/5{
2307
2534
  width: 20%;
2308
2535
  }
2309
2536
 
2310
- .pelcro-root .plc-w-2\/5 {
2537
+ .pelcro-root .plc-w-2\/5{
2311
2538
  width: 40%;
2312
2539
  }
2313
2540
 
2314
- .pelcro-root .plc-w-2\/12 {
2541
+ .pelcro-root .plc-w-2\/12{
2315
2542
  width: 16.666667%;
2316
2543
  }
2317
2544
 
2318
- .pelcro-root .plc-w-3\/12 {
2545
+ .pelcro-root .plc-w-3\/12{
2319
2546
  width: 25%;
2320
2547
  }
2321
2548
 
2322
- .pelcro-root .plc-w-4\/12 {
2549
+ .pelcro-root .plc-w-4\/12{
2323
2550
  width: 33.333333%;
2324
2551
  }
2325
2552
 
2326
- .pelcro-root .plc-w-5\/12 {
2553
+ .pelcro-root .plc-w-5\/12{
2327
2554
  width: 41.666667%;
2328
2555
  }
2329
2556
 
2330
- .pelcro-root .plc-w-6\/12 {
2557
+ .pelcro-root .plc-w-6\/12{
2331
2558
  width: 50%;
2332
2559
  }
2333
2560
 
2334
- .pelcro-root .plc-w-10\/12 {
2335
- width: 83.333333%;
2336
- }
2337
-
2338
- .pelcro-root .plc-w-full {
2561
+ .pelcro-root .plc-w-full{
2339
2562
  width: 100%;
2340
2563
  }
2341
2564
 
2342
- .pelcro-root .plc-w-max {
2565
+ .pelcro-root .plc-w-max{
2343
2566
  width: max-content;
2344
2567
  }
2345
2568
 
2346
- .pelcro-root .plc-max-w-50\% {
2347
- max-width: 50%;
2569
+ .pelcro-root .plc-max-w-xl{
2570
+ max-width: 36rem;
2348
2571
  }
2349
2572
 
2350
- .pelcro-root .plc-max-w-80\% {
2351
- max-width: 80%;
2573
+ .pelcro-root .plc-max-w-3xl{
2574
+ max-width: 48rem;
2352
2575
  }
2353
2576
 
2354
- .pelcro-root .plc-max-w-90\% {
2355
- max-width: 90%;
2577
+ .pelcro-root .plc-max-w-50\%{
2578
+ max-width: 50%;
2579
+ }
2580
+
2581
+ .pelcro-root .plc-max-w-full{
2582
+ max-width: 100%;
2356
2583
  }
2357
2584
 
2358
- .pelcro-root .plc-flex-1 {
2585
+ .pelcro-root .plc-flex-1{
2359
2586
  flex: 1 1 0%;
2360
2587
  }
2361
2588
 
2362
- .pelcro-root .plc-flex-shrink-0 {
2589
+ .pelcro-root .plc-flex-shrink-0{
2363
2590
  flex-shrink: 0;
2364
2591
  }
2365
2592
 
2366
- .pelcro-root .plc-flex-grow {
2593
+ .pelcro-root .plc-flex-grow{
2367
2594
  flex-grow: 1;
2368
2595
  }
2369
2596
 
2370
- .pelcro-root .plc-table-fixed {
2597
+ .pelcro-root .plc-table-fixed{
2371
2598
  table-layout: fixed;
2372
2599
  }
2373
2600
 
2374
- .pelcro-root .plc-origin-right {
2601
+ .pelcro-root .plc-origin-right{
2375
2602
  transform-origin: right;
2376
2603
  }
2377
2604
 
2378
- .pelcro-root .plc-transform {
2605
+ .pelcro-root .plc-transform{
2379
2606
  --tw-translate-x: 0;
2380
2607
  --tw-translate-y: 0;
2381
2608
  --tw-rotate: 0;
@@ -2386,945 +2613,1037 @@ in order to scope selectors under pelcro-root
2386
2613
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2387
2614
  }
2388
2615
 
2389
- .pelcro-root .plc-translate-x-0 {
2616
+ .pelcro-root .plc-translate-x-0{
2390
2617
  --tw-translate-x: 0px;
2391
2618
  }
2392
2619
 
2393
- .pelcro-root .plc--translate-x-full {
2620
+ .pelcro-root .plc--translate-x-1{
2621
+ --tw-translate-x: -0.25rem;
2622
+ }
2623
+
2624
+ .pelcro-root .plc--translate-x-full{
2394
2625
  --tw-translate-x: -100%;
2395
2626
  }
2396
2627
 
2397
- .pelcro-root .plc--translate-y-1\/2 {
2628
+ .pelcro-root .plc--translate-y-1\/2{
2398
2629
  --tw-translate-y: -50%;
2399
2630
  }
2400
2631
 
2401
- .pelcro-root .plc-group:hover .group-hover\:plc-translate-x-1 {
2632
+ .pelcro-root .plc-group:hover .group-hover\:plc-translate-x-1{
2402
2633
  --tw-translate-x: 0.25rem;
2403
2634
  }
2404
2635
 
2405
- .pelcro-root .plc-rotate-90 {
2636
+ .pelcro-root .plc-rotate-90{
2406
2637
  --tw-rotate: 90deg;
2407
2638
  }
2408
2639
 
2409
- .pelcro-root .plc-rotate-180 {
2640
+ .pelcro-root .plc-rotate-180{
2410
2641
  --tw-rotate: 180deg;
2411
2642
  }
2412
2643
 
2413
- .pelcro-root .plc-scale-120 {
2644
+ .pelcro-root .plc-scale-105{
2645
+ --tw-scale-x: 1.05;
2646
+ --tw-scale-y: 1.05;
2647
+ }
2648
+
2649
+ .pelcro-root .plc-scale-120{
2414
2650
  --tw-scale-x: 1.2;
2415
2651
  --tw-scale-y: 1.2;
2416
2652
  }
2417
2653
 
2418
- .pelcro-root .plc-scale-x-0 {
2654
+ .pelcro-root .plc-scale-x-0{
2419
2655
  --tw-scale-x: 0;
2420
2656
  }
2421
2657
 
2422
- .pelcro-root .plc-scale-x-100 {
2658
+ .pelcro-root .plc-scale-x-100{
2423
2659
  --tw-scale-x: 1;
2424
2660
  }
2425
2661
 
2426
- @keyframes plc-spin {
2427
- to {
2662
+ @keyframes plc-spin{
2663
+ to{
2428
2664
  transform: rotate(360deg);
2429
2665
  }
2430
2666
  }
2431
2667
 
2432
- @keyframes plc-ping {
2433
- 75%, 100% {
2668
+ @keyframes plc-ping{
2669
+ 75%, 100%{
2434
2670
  transform: scale(2);
2435
2671
  opacity: 0;
2436
2672
  }
2437
2673
  }
2438
2674
 
2439
- @keyframes plc-pulse {
2440
- 50% {
2675
+ @keyframes plc-pulse{
2676
+ 50%{
2441
2677
  opacity: .5;
2442
2678
  }
2443
2679
  }
2444
2680
 
2445
- @keyframes plc-bounce {
2446
- 0%, 100% {
2681
+ @keyframes plc-bounce{
2682
+ 0%, 100%{
2447
2683
  transform: translateY(-25%);
2448
2684
  animation-timing-function: cubic-bezier(0.8,0,1,1);
2449
2685
  }
2450
2686
 
2451
- 50% {
2687
+ 50%{
2452
2688
  transform: none;
2453
2689
  animation-timing-function: cubic-bezier(0,0,0.2,1);
2454
2690
  }
2455
2691
  }
2456
2692
 
2457
- @keyframes plc-slideInBottom {
2458
- 0% {
2693
+ @keyframes plc-slideInBottom{
2694
+ 0%{
2459
2695
  transform: translateY(1000px);
2460
2696
  opacity: 0;
2461
2697
  }
2462
2698
 
2463
- 100% {
2699
+ 100%{
2464
2700
  transform: translateY(0);
2465
2701
  opacity: 1;
2466
2702
  }
2467
2703
  }
2468
2704
 
2469
- .pelcro-root .plc-animate-spin {
2705
+ .pelcro-root .plc-animate-spin{
2470
2706
  animation: plc-spin 1s linear infinite;
2471
2707
  }
2472
2708
 
2473
- @media (prefers-reduced-motion: no-preference) {
2474
- .pelcro-root .motion-safe\:plc-animate-slideInBottom {
2709
+ .pelcro-root .plc-animate-pulse{
2710
+ animation: plc-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
2711
+ }
2712
+
2713
+ @media (prefers-reduced-motion: no-preference){
2714
+ .pelcro-root .motion-safe\:plc-animate-slideInBottom{
2475
2715
  animation: plc-slideInBottom 0.5s ease-out;
2476
2716
  }
2477
2717
  }
2478
2718
 
2479
- .pelcro-root .plc-cursor-default {
2719
+ .pelcro-root .plc-cursor-default{
2480
2720
  cursor: default;
2481
2721
  }
2482
2722
 
2483
- .pelcro-root .plc-cursor-pointer {
2723
+ .pelcro-root .plc-cursor-pointer{
2484
2724
  cursor: pointer;
2485
2725
  }
2486
2726
 
2487
- .pelcro-root .plc-select-none {
2727
+ .pelcro-root .plc-select-none{
2488
2728
  -webkit-user-select: none;
2489
2729
  user-select: none;
2490
2730
  }
2491
2731
 
2492
- .pelcro-root .plc-appearance-none {
2493
- -webkit-appearance: none;
2494
- appearance: none;
2732
+ .pelcro-root .plc-grid-cols-1{
2733
+ grid-template-columns: repeat(1, minmax(0, 1fr));
2495
2734
  }
2496
2735
 
2497
- .pelcro-root .plc-flex-row-reverse {
2736
+ .pelcro-root .plc-grid-cols-2{
2737
+ grid-template-columns: repeat(2, minmax(0, 1fr));
2738
+ }
2739
+
2740
+ .pelcro-root .plc-flex-row{
2741
+ flex-direction: row;
2742
+ }
2743
+
2744
+ .pelcro-root .plc-flex-row-reverse{
2498
2745
  flex-direction: row-reverse;
2499
2746
  }
2500
2747
 
2501
- .pelcro-root .plc-flex-col {
2748
+ .pelcro-root .plc-flex-col{
2502
2749
  flex-direction: column;
2503
2750
  }
2504
2751
 
2505
- .pelcro-root .plc-flex-wrap {
2752
+ .pelcro-root .plc-flex-wrap{
2506
2753
  flex-wrap: wrap;
2507
2754
  }
2508
2755
 
2509
- .pelcro-root .plc-place-items-center {
2756
+ .pelcro-root .plc-place-items-center{
2510
2757
  place-items: center;
2511
2758
  }
2512
2759
 
2513
- .pelcro-root .plc-items-start {
2760
+ .pelcro-root .plc-items-start{
2514
2761
  align-items: flex-start;
2515
2762
  }
2516
2763
 
2517
- .pelcro-root .plc-items-end {
2764
+ .pelcro-root .plc-items-end{
2518
2765
  align-items: flex-end;
2519
2766
  }
2520
2767
 
2521
- .pelcro-root .plc-items-center {
2768
+ .pelcro-root .plc-items-center{
2522
2769
  align-items: center;
2523
2770
  }
2524
2771
 
2525
- .pelcro-root .plc-items-stretch {
2772
+ .pelcro-root .plc-items-stretch{
2526
2773
  align-items: stretch;
2527
2774
  }
2528
2775
 
2529
- .pelcro-root .plc-justify-end {
2776
+ .pelcro-root .plc-justify-end{
2530
2777
  justify-content: flex-end;
2531
2778
  }
2532
2779
 
2533
- .pelcro-root .plc-justify-center {
2780
+ .pelcro-root .plc-justify-center{
2534
2781
  justify-content: center;
2535
2782
  }
2536
2783
 
2537
- .pelcro-root .plc-justify-between {
2784
+ .pelcro-root .plc-justify-between{
2538
2785
  justify-content: space-between;
2539
2786
  }
2540
2787
 
2541
- .pelcro-root .plc-justify-evenly {
2788
+ .pelcro-root .plc-justify-evenly{
2542
2789
  justify-content: space-evenly;
2543
2790
  }
2544
2791
 
2545
- .pelcro-root .plc-justify-items-center {
2792
+ .pelcro-root .plc-justify-items-center{
2546
2793
  justify-items: center;
2547
2794
  }
2548
2795
 
2549
- .pelcro-root .plc-gap-x-3 {
2796
+ .pelcro-root .plc-gap-x-3{
2550
2797
  column-gap: 0.75rem;
2551
2798
  }
2552
2799
 
2553
- .pelcro-root .plc-gap-y-2 {
2800
+ .pelcro-root .plc-gap-y-2{
2554
2801
  row-gap: 0.5rem;
2555
2802
  }
2556
2803
 
2557
- .pelcro-root .plc-gap-y-5 {
2804
+ .pelcro-root .plc-gap-y-5{
2558
2805
  row-gap: 1.25rem;
2559
2806
  }
2560
2807
 
2561
- .pelcro-root .plc-space-x-2 > :not([hidden]) ~ :not([hidden]) {
2808
+ .pelcro-root .plc-space-x-0 > :not([hidden]) ~ :not([hidden]){
2809
+ --tw-space-x-reverse: 0;
2810
+ margin-right: calc(0px * var(--tw-space-x-reverse));
2811
+ margin-left: calc(0px * calc(1 - var(--tw-space-x-reverse)));
2812
+ }
2813
+
2814
+ .pelcro-root .plc-space-x-2 > :not([hidden]) ~ :not([hidden]){
2562
2815
  --tw-space-x-reverse: 0;
2563
2816
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
2564
2817
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
2565
2818
  }
2566
2819
 
2567
- .pelcro-root .plc-space-x-3 > :not([hidden]) ~ :not([hidden]) {
2820
+ .pelcro-root .plc-space-x-3 > :not([hidden]) ~ :not([hidden]){
2568
2821
  --tw-space-x-reverse: 0;
2569
2822
  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
2570
2823
  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
2571
2824
  }
2572
2825
 
2573
- .pelcro-root .plc-space-y-2 > :not([hidden]) ~ :not([hidden]) {
2826
+ .pelcro-root .plc-space-y-2 > :not([hidden]) ~ :not([hidden]){
2574
2827
  --tw-space-y-reverse: 0;
2575
2828
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
2576
2829
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
2577
2830
  }
2578
2831
 
2579
- .pelcro-root .plc-space-y-4 > :not([hidden]) ~ :not([hidden]) {
2832
+ .pelcro-root .plc-space-y-3 > :not([hidden]) ~ :not([hidden]){
2833
+ --tw-space-y-reverse: 0;
2834
+ margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
2835
+ margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
2836
+ }
2837
+
2838
+ .pelcro-root .plc-space-y-4 > :not([hidden]) ~ :not([hidden]){
2580
2839
  --tw-space-y-reverse: 0;
2581
2840
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
2582
2841
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
2583
2842
  }
2584
2843
 
2585
- .pelcro-root .plc-overflow-auto {
2844
+ .pelcro-root .plc-overflow-auto{
2586
2845
  overflow: auto;
2587
2846
  }
2588
2847
 
2589
- .pelcro-root .plc-overflow-hidden {
2848
+ .pelcro-root .plc-overflow-hidden{
2590
2849
  overflow: hidden;
2591
2850
  }
2592
2851
 
2593
- .pelcro-root .plc-overflow-x-auto {
2594
- overflow-x: auto;
2852
+ .pelcro-root .plc-overflow-y-auto{
2853
+ overflow-y: auto;
2595
2854
  }
2596
2855
 
2597
- .pelcro-root .plc-overflow-y-auto {
2598
- overflow-y: auto;
2856
+ .pelcro-root .plc-overflow-x-hidden{
2857
+ overflow-x: hidden;
2599
2858
  }
2600
2859
 
2601
- .pelcro-root .plc-overflow-y-scroll {
2860
+ .pelcro-root .plc-overflow-y-scroll{
2602
2861
  overflow-y: scroll;
2603
2862
  }
2604
2863
 
2605
- .pelcro-root .plc-truncate {
2864
+ .pelcro-root .plc-truncate{
2606
2865
  overflow: hidden;
2607
2866
  text-overflow: ellipsis;
2608
2867
  white-space: nowrap;
2609
2868
  }
2610
2869
 
2611
- .pelcro-root .plc-whitespace-nowrap {
2612
- white-space: nowrap;
2870
+ .pelcro-root .plc-whitespace-normal{
2871
+ white-space: normal;
2613
2872
  }
2614
2873
 
2615
- .pelcro-root .plc-whitespace-pre-line {
2874
+ .pelcro-root .plc-whitespace-pre-line{
2616
2875
  white-space: pre-line;
2617
2876
  }
2618
2877
 
2619
- .pelcro-root .plc-break-words {
2878
+ .pelcro-root .plc-break-words{
2620
2879
  overflow-wrap: break-word;
2621
2880
  }
2622
2881
 
2623
- .pelcro-root .plc-rounded-none {
2882
+ .pelcro-root .plc-break-all{
2883
+ word-break: break-all;
2884
+ }
2885
+
2886
+ .pelcro-root .plc-rounded-none{
2624
2887
  border-radius: 0px;
2625
2888
  }
2626
2889
 
2627
- .pelcro-root .plc-rounded-sm {
2890
+ .pelcro-root .plc-rounded-sm{
2628
2891
  border-radius: 0.125rem;
2629
2892
  }
2630
2893
 
2631
- .pelcro-root .plc-rounded {
2894
+ .pelcro-root .plc-rounded{
2632
2895
  border-radius: 0.25rem;
2633
2896
  }
2634
2897
 
2635
- .pelcro-root .plc-rounded-md {
2898
+ .pelcro-root .plc-rounded-md{
2636
2899
  border-radius: 0.375rem;
2637
2900
  }
2638
2901
 
2639
- .pelcro-root .plc-rounded-lg {
2902
+ .pelcro-root .plc-rounded-lg{
2640
2903
  border-radius: 0.5rem;
2641
2904
  }
2642
2905
 
2643
- .pelcro-root .plc-rounded-2xl {
2906
+ .pelcro-root .plc-rounded-2xl{
2644
2907
  border-radius: 1rem;
2645
2908
  }
2646
2909
 
2647
- .pelcro-root .plc-rounded-full {
2910
+ .pelcro-root .plc-rounded-full{
2648
2911
  border-radius: 9999px;
2649
2912
  }
2650
2913
 
2651
- .pelcro-root .plc-border-0 {
2914
+ .pelcro-root .plc-rounded-b-sm{
2915
+ border-bottom-right-radius: 0.125rem;
2916
+ border-bottom-left-radius: 0.125rem;
2917
+ }
2918
+
2919
+ .pelcro-root .plc-border-0{
2652
2920
  border-width: 0px;
2653
2921
  }
2654
2922
 
2655
- .pelcro-root .plc-border-2 {
2923
+ .pelcro-root .plc-border-2{
2656
2924
  border-width: 2px;
2657
2925
  }
2658
2926
 
2659
- .pelcro-root .plc-border {
2927
+ .pelcro-root .plc-border{
2660
2928
  border-width: 1px;
2661
2929
  }
2662
2930
 
2663
- .pelcro-root .last\:plc-border-0:last-child {
2931
+ .pelcro-root .last\:plc-border-0:last-child{
2664
2932
  border-width: 0px;
2665
2933
  }
2666
2934
 
2667
- .pelcro-root .plc-border-t-2 {
2935
+ .pelcro-root .plc-border-t-2{
2668
2936
  border-top-width: 2px;
2669
2937
  }
2670
2938
 
2671
- .pelcro-root .plc-border-t-4 {
2939
+ .pelcro-root .plc-border-t-4{
2672
2940
  border-top-width: 4px;
2673
2941
  }
2674
2942
 
2675
- .pelcro-root .plc-border-t-8 {
2943
+ .pelcro-root .plc-border-t-8{
2676
2944
  border-top-width: 8px;
2677
2945
  }
2678
2946
 
2679
- .pelcro-root .plc-border-t {
2947
+ .pelcro-root .plc-border-t{
2680
2948
  border-top-width: 1px;
2681
2949
  }
2682
2950
 
2683
- .pelcro-root .plc-border-b-2 {
2951
+ .pelcro-root .plc-border-b-2{
2684
2952
  border-bottom-width: 2px;
2685
2953
  }
2686
2954
 
2687
- .pelcro-root .plc-border-b {
2955
+ .pelcro-root .plc-border-b-4{
2956
+ border-bottom-width: 4px;
2957
+ }
2958
+
2959
+ .pelcro-root .plc-border-b{
2688
2960
  border-bottom-width: 1px;
2689
2961
  }
2690
2962
 
2691
- .pelcro-root .plc-border-l-2 {
2963
+ .pelcro-root .plc-border-l-2{
2692
2964
  border-left-width: 2px;
2693
2965
  }
2694
2966
 
2695
- .pelcro-root .plc-border-l-4 {
2967
+ .pelcro-root .plc-border-l-4{
2696
2968
  border-left-width: 4px;
2697
2969
  }
2698
2970
 
2699
- .pelcro-root .plc-border-solid {
2971
+ .pelcro-root .plc-border-solid{
2700
2972
  border-style: solid;
2701
2973
  }
2702
2974
 
2703
- .pelcro-root .plc-border-transparent {
2975
+ .pelcro-root .plc-border-transparent{
2704
2976
  border-color: transparent;
2705
2977
  }
2706
2978
 
2707
- .pelcro-root .plc-border-primary-300 {
2979
+ .pelcro-root .plc-border-primary-300{
2708
2980
  border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 20%));
2709
2981
  }
2710
2982
 
2711
- .pelcro-root .plc-border-primary-400 {
2983
+ .pelcro-root .plc-border-primary-400{
2712
2984
  border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
2713
2985
  }
2714
2986
 
2715
- .pelcro-root .plc-border-primary-500 {
2987
+ .pelcro-root .plc-border-primary-500{
2716
2988
  border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
2717
2989
  }
2718
2990
 
2719
- .pelcro-root .plc-border-primary-800 {
2720
- border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
2991
+ .pelcro-root .plc-border-primary{
2992
+ border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
2721
2993
  }
2722
2994
 
2723
- .pelcro-root .plc-border-white {
2995
+ .pelcro-root .plc-border-white{
2724
2996
  --tw-border-opacity: 1;
2725
2997
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
2726
2998
  }
2727
2999
 
2728
- .pelcro-root .plc-border-gray-200 {
3000
+ .pelcro-root .plc-border-gray-200{
2729
3001
  --tw-border-opacity: 1;
2730
3002
  border-color: rgba(229, 231, 235, var(--tw-border-opacity));
2731
3003
  }
2732
3004
 
2733
- .pelcro-root .plc-border-gray-300 {
3005
+ .pelcro-root .plc-border-gray-300{
2734
3006
  --tw-border-opacity: 1;
2735
3007
  border-color: rgba(209, 213, 219, var(--tw-border-opacity));
2736
3008
  }
2737
3009
 
2738
- .pelcro-root .plc-border-gray-400 {
3010
+ .pelcro-root .plc-border-gray-400{
2739
3011
  --tw-border-opacity: 1;
2740
3012
  border-color: rgba(156, 163, 175, var(--tw-border-opacity));
2741
3013
  }
2742
3014
 
2743
- .pelcro-root .plc-border-green-400 {
3015
+ .pelcro-root .plc-border-green-400{
2744
3016
  --tw-border-opacity: 1;
2745
3017
  border-color: rgba(52, 211, 153, var(--tw-border-opacity));
2746
3018
  }
2747
3019
 
2748
- .pelcro-root .hover\:plc-border-primary-800:hover {
3020
+ .pelcro-root .hover\:plc-border-primary-600:hover{
3021
+ border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
3022
+ }
3023
+
3024
+ .pelcro-root .hover\:plc-border-primary-800:hover{
2749
3025
  border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
2750
3026
  }
2751
3027
 
2752
- .pelcro-root .plc-bg-transparent {
3028
+ .pelcro-root .hover\:plc-border-primary:hover{
3029
+ border-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3030
+ }
3031
+
3032
+ .pelcro-root .plc-bg-transparent{
2753
3033
  background-color: transparent;
2754
3034
  }
2755
3035
 
2756
- .pelcro-root .plc-bg-primary-200 {
3036
+ .pelcro-root .plc-bg-primary-200{
2757
3037
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 30%));
2758
3038
  }
2759
3039
 
2760
- .pelcro-root .plc-bg-primary-400 {
3040
+ .pelcro-root .plc-bg-primary-400{
2761
3041
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
2762
3042
  }
2763
3043
 
2764
- .pelcro-root .plc-bg-primary-700 {
2765
- background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 20%));
2766
- }
2767
-
2768
- .pelcro-root .plc-bg-primary-800 {
2769
- background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
3044
+ .pelcro-root .plc-bg-primary{
3045
+ background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
2770
3046
  }
2771
3047
 
2772
- .pelcro-root .plc-bg-white {
3048
+ .pelcro-root .plc-bg-white{
2773
3049
  --tw-bg-opacity: 1;
2774
3050
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
2775
3051
  }
2776
3052
 
2777
- .pelcro-root .plc-bg-gray-50 {
2778
- --tw-bg-opacity: 1;
2779
- background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
2780
- }
2781
-
2782
- .pelcro-root .plc-bg-gray-100 {
3053
+ .pelcro-root .plc-bg-gray-100{
2783
3054
  --tw-bg-opacity: 1;
2784
3055
  background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
2785
3056
  }
2786
3057
 
2787
- .pelcro-root .plc-bg-gray-200 {
3058
+ .pelcro-root .plc-bg-gray-200{
2788
3059
  --tw-bg-opacity: 1;
2789
3060
  background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
2790
3061
  }
2791
3062
 
2792
- .pelcro-root .plc-bg-gray-300 {
3063
+ .pelcro-root .plc-bg-gray-300{
2793
3064
  --tw-bg-opacity: 1;
2794
3065
  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));
2795
3066
  }
2796
3067
 
2797
- .pelcro-root .plc-bg-gray-500 {
3068
+ .pelcro-root .plc-bg-gray-400{
3069
+ --tw-bg-opacity: 1;
3070
+ background-color: rgba(156, 163, 175, var(--tw-bg-opacity));
3071
+ }
3072
+
3073
+ .pelcro-root .plc-bg-gray-500{
2798
3074
  --tw-bg-opacity: 1;
2799
3075
  background-color: rgba(107, 114, 128, var(--tw-bg-opacity));
2800
3076
  }
2801
3077
 
2802
- .pelcro-root .plc-bg-gray-600 {
3078
+ .pelcro-root .plc-bg-gray-600{
2803
3079
  --tw-bg-opacity: 1;
2804
3080
  background-color: rgba(75, 85, 99, var(--tw-bg-opacity));
2805
3081
  }
2806
3082
 
2807
- .pelcro-root .plc-bg-gray-800 {
3083
+ .pelcro-root .plc-bg-gray-800{
2808
3084
  --tw-bg-opacity: 1;
2809
3085
  background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
2810
3086
  }
2811
3087
 
2812
- .pelcro-root .plc-bg-red-100 {
3088
+ .pelcro-root .plc-bg-red-100{
2813
3089
  --tw-bg-opacity: 1;
2814
3090
  background-color: rgba(239, 190, 188, var(--tw-bg-opacity));
2815
3091
  }
2816
3092
 
2817
- .pelcro-root .plc-bg-red-500 {
3093
+ .pelcro-root .plc-bg-red-500{
2818
3094
  --tw-bg-opacity: 1;
2819
3095
  background-color: rgba(180, 48, 43, var(--tw-bg-opacity));
2820
3096
  }
2821
3097
 
2822
- .pelcro-root .plc-bg-yellow-100 {
3098
+ .pelcro-root .plc-bg-yellow-100{
2823
3099
  --tw-bg-opacity: 1;
2824
3100
  background-color: rgba(254, 243, 199, var(--tw-bg-opacity));
2825
3101
  }
2826
3102
 
2827
- .pelcro-root .plc-bg-green-50 {
3103
+ .pelcro-root .plc-bg-green-50{
2828
3104
  --tw-bg-opacity: 1;
2829
3105
  background-color: rgba(236, 253, 245, var(--tw-bg-opacity));
2830
3106
  }
2831
3107
 
2832
- .pelcro-root .plc-bg-green-100 {
3108
+ .pelcro-root .plc-bg-green-100{
2833
3109
  --tw-bg-opacity: 1;
2834
3110
  background-color: rgba(209, 250, 229, var(--tw-bg-opacity));
2835
3111
  }
2836
3112
 
2837
- .pelcro-root .plc-bg-blue-100 {
3113
+ .pelcro-root .plc-bg-blue-100{
2838
3114
  --tw-bg-opacity: 1;
2839
3115
  background-color: rgba(219, 234, 254, var(--tw-bg-opacity));
2840
3116
  }
2841
3117
 
2842
- .pelcro-root .plc-bg-orange-100 {
3118
+ .pelcro-root .plc-bg-orange-100{
2843
3119
  --tw-bg-opacity: 1;
2844
3120
  background-color: rgba(255, 237, 213, var(--tw-bg-opacity));
2845
3121
  }
2846
3122
 
2847
- .pelcro-root .hover\:plc-bg-transparent:hover {
3123
+ .pelcro-root .hover\:plc-bg-transparent:hover{
2848
3124
  background-color: transparent;
2849
3125
  }
2850
3126
 
2851
- .pelcro-root .hover\:plc-bg-primary-600:hover {
3127
+ .pelcro-root .hover\:plc-bg-primary-600:hover{
2852
3128
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
2853
3129
  }
2854
3130
 
2855
- .pelcro-root .hover\:plc-bg-white:hover {
3131
+ .pelcro-root .hover\:plc-bg-primary:hover{
3132
+ background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3133
+ }
3134
+
3135
+ .pelcro-root .hover\:plc-bg-white:hover{
2856
3136
  --tw-bg-opacity: 1;
2857
3137
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
2858
3138
  }
2859
3139
 
2860
- .pelcro-root .hover\:plc-bg-gray-50:hover {
3140
+ .pelcro-root .hover\:plc-bg-gray-50:hover{
2861
3141
  --tw-bg-opacity: 1;
2862
3142
  background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
2863
3143
  }
2864
3144
 
2865
- .pelcro-root .hover\:plc-bg-gray-100:hover {
3145
+ .pelcro-root .hover\:plc-bg-gray-100:hover{
2866
3146
  --tw-bg-opacity: 1;
2867
3147
  background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
2868
3148
  }
2869
3149
 
2870
- .pelcro-root .hover\:plc-bg-gray-600:hover {
3150
+ .pelcro-root .hover\:plc-bg-gray-600:hover{
2871
3151
  --tw-bg-opacity: 1;
2872
3152
  background-color: rgba(75, 85, 99, var(--tw-bg-opacity));
2873
3153
  }
2874
3154
 
2875
- .pelcro-root .hover\:plc-bg-gray-900:hover {
3155
+ .pelcro-root .hover\:plc-bg-gray-900:hover{
2876
3156
  --tw-bg-opacity: 1;
2877
3157
  background-color: rgba(17, 24, 39, var(--tw-bg-opacity));
2878
3158
  }
2879
3159
 
2880
- .pelcro-root .hover\:plc-bg-red-600:hover {
3160
+ .pelcro-root .hover\:plc-bg-red-600:hover{
2881
3161
  --tw-bg-opacity: 1;
2882
3162
  background-color: rgba(139, 37, 33, var(--tw-bg-opacity));
2883
3163
  }
2884
3164
 
2885
- .pelcro-root .focus\:plc-bg-transparent:focus {
3165
+ .pelcro-root .focus\:plc-bg-transparent:focus{
2886
3166
  background-color: transparent;
2887
3167
  }
2888
3168
 
2889
- .pelcro-root .focus\:plc-bg-primary-600:focus {
3169
+ .pelcro-root .focus\:plc-bg-primary-600:focus{
2890
3170
  background-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
2891
3171
  }
2892
3172
 
2893
- .pelcro-root .disabled\:plc-bg-gray-400:disabled {
3173
+ .pelcro-root .disabled\:plc-bg-gray-400:disabled{
2894
3174
  --tw-bg-opacity: 1;
2895
3175
  background-color: rgba(156, 163, 175, var(--tw-bg-opacity));
2896
3176
  }
2897
3177
 
2898
- .pelcro-root .plc-fill-current {
3178
+ .pelcro-root .plc-fill-current{
2899
3179
  fill: currentColor;
2900
3180
  }
2901
3181
 
2902
- .pelcro-root .plc-object-contain {
3182
+ .pelcro-root .plc-object-contain{
2903
3183
  object-fit: contain;
2904
3184
  }
2905
3185
 
2906
- .pelcro-root .plc-object-left {
2907
- object-position: left;
3186
+ .pelcro-root .plc-object-center{
3187
+ object-position: center;
2908
3188
  }
2909
3189
 
2910
- .pelcro-root .plc-p-1 {
3190
+ .pelcro-root .plc-p-1{
2911
3191
  padding: 0.25rem;
2912
3192
  }
2913
3193
 
2914
- .pelcro-root .plc-p-2 {
3194
+ .pelcro-root .plc-p-2{
2915
3195
  padding: 0.5rem;
2916
3196
  }
2917
3197
 
2918
- .pelcro-root .plc-p-3 {
2919
- padding: 0.75rem;
2920
- }
2921
-
2922
- .pelcro-root .plc-p-4 {
3198
+ .pelcro-root .plc-p-4{
2923
3199
  padding: 1rem;
2924
3200
  }
2925
3201
 
2926
- .pelcro-root .plc-p-5 {
3202
+ .pelcro-root .plc-p-5{
2927
3203
  padding: 1.25rem;
2928
3204
  }
2929
3205
 
2930
- .pelcro-root .plc-p-6 {
3206
+ .pelcro-root .plc-p-6{
2931
3207
  padding: 1.5rem;
2932
3208
  }
2933
3209
 
2934
- .pelcro-root .plc-p-8 {
2935
- padding: 2rem;
3210
+ .pelcro-root .plc-px-0{
3211
+ padding-left: 0px;
3212
+ padding-right: 0px;
2936
3213
  }
2937
3214
 
2938
- .pelcro-root .plc-px-1 {
3215
+ .pelcro-root .plc-px-1{
2939
3216
  padding-left: 0.25rem;
2940
3217
  padding-right: 0.25rem;
2941
3218
  }
2942
3219
 
2943
- .pelcro-root .plc-px-2 {
3220
+ .pelcro-root .plc-px-2{
2944
3221
  padding-left: 0.5rem;
2945
3222
  padding-right: 0.5rem;
2946
3223
  }
2947
3224
 
2948
- .pelcro-root .plc-px-3 {
3225
+ .pelcro-root .plc-px-3{
2949
3226
  padding-left: 0.75rem;
2950
3227
  padding-right: 0.75rem;
2951
3228
  }
2952
3229
 
2953
- .pelcro-root .plc-px-4 {
3230
+ .pelcro-root .plc-px-4{
2954
3231
  padding-left: 1rem;
2955
3232
  padding-right: 1rem;
2956
3233
  }
2957
3234
 
2958
- .pelcro-root .plc-px-5 {
2959
- padding-left: 1.25rem;
2960
- padding-right: 1.25rem;
2961
- }
2962
-
2963
- .pelcro-root .plc-px-6 {
3235
+ .pelcro-root .plc-px-6{
2964
3236
  padding-left: 1.5rem;
2965
3237
  padding-right: 1.5rem;
2966
3238
  }
2967
3239
 
2968
- .pelcro-root .plc-px-8 {
3240
+ .pelcro-root .plc-px-8{
2969
3241
  padding-left: 2rem;
2970
3242
  padding-right: 2rem;
2971
3243
  }
2972
3244
 
2973
- .pelcro-root .plc-py-1 {
3245
+ .pelcro-root .plc-py-1{
2974
3246
  padding-top: 0.25rem;
2975
3247
  padding-bottom: 0.25rem;
2976
3248
  }
2977
3249
 
2978
- .pelcro-root .plc-py-2 {
3250
+ .pelcro-root .plc-py-2{
2979
3251
  padding-top: 0.5rem;
2980
3252
  padding-bottom: 0.5rem;
2981
3253
  }
2982
3254
 
2983
- .pelcro-root .plc-py-3 {
3255
+ .pelcro-root .plc-py-3{
2984
3256
  padding-top: 0.75rem;
2985
3257
  padding-bottom: 0.75rem;
2986
3258
  }
2987
3259
 
2988
- .pelcro-root .plc-py-4 {
3260
+ .pelcro-root .plc-py-4{
2989
3261
  padding-top: 1rem;
2990
3262
  padding-bottom: 1rem;
2991
3263
  }
2992
3264
 
2993
- .pelcro-root .plc-py-5 {
3265
+ .pelcro-root .plc-py-5{
2994
3266
  padding-top: 1.25rem;
2995
3267
  padding-bottom: 1.25rem;
2996
3268
  }
2997
3269
 
2998
- .pelcro-root .plc-pt-1 {
3270
+ .pelcro-root .plc-py-6{
3271
+ padding-top: 1.5rem;
3272
+ padding-bottom: 1.5rem;
3273
+ }
3274
+
3275
+ .pelcro-root .plc-pt-1{
2999
3276
  padding-top: 0.25rem;
3000
3277
  }
3001
3278
 
3002
- .pelcro-root .plc-pt-2 {
3279
+ .pelcro-root .plc-pt-2{
3003
3280
  padding-top: 0.5rem;
3004
3281
  }
3005
3282
 
3006
- .pelcro-root .plc-pt-4 {
3283
+ .pelcro-root .plc-pt-4{
3007
3284
  padding-top: 1rem;
3008
3285
  }
3009
3286
 
3010
- .pelcro-root .plc-pr-1 {
3287
+ .pelcro-root .plc-pt-5{
3288
+ padding-top: 1.25rem;
3289
+ }
3290
+
3291
+ .pelcro-root .plc-pr-1{
3011
3292
  padding-right: 0.25rem;
3012
3293
  }
3013
3294
 
3014
- .pelcro-root .plc-pr-2 {
3295
+ .pelcro-root .plc-pr-2{
3015
3296
  padding-right: 0.5rem;
3016
3297
  }
3017
3298
 
3018
- .pelcro-root .plc-pr-4 {
3299
+ .pelcro-root .plc-pr-4{
3019
3300
  padding-right: 1rem;
3020
3301
  }
3021
3302
 
3022
- .pelcro-root .plc-pb-4 {
3303
+ .pelcro-root .plc-pr-8{
3304
+ padding-right: 2rem;
3305
+ }
3306
+
3307
+ .pelcro-root .plc-pb-2{
3308
+ padding-bottom: 0.5rem;
3309
+ }
3310
+
3311
+ .pelcro-root .plc-pb-4{
3023
3312
  padding-bottom: 1rem;
3024
3313
  }
3025
3314
 
3026
- .pelcro-root .plc-pl-2 {
3315
+ .pelcro-root .plc-pl-2{
3027
3316
  padding-left: 0.5rem;
3028
3317
  }
3029
3318
 
3030
- .pelcro-root .plc-pl-4 {
3319
+ .pelcro-root .plc-pl-4{
3031
3320
  padding-left: 1rem;
3032
3321
  }
3033
3322
 
3034
- .pelcro-root .plc-text-left {
3323
+ .pelcro-root .plc-pl-20{
3324
+ padding-left: 5rem;
3325
+ }
3326
+
3327
+ .pelcro-root .plc-text-left{
3035
3328
  text-align: left;
3036
3329
  }
3037
3330
 
3038
- .pelcro-root .plc-text-center {
3331
+ .pelcro-root .plc-text-center{
3039
3332
  text-align: center;
3040
3333
  }
3041
3334
 
3042
- .pelcro-root .plc-align-top {
3335
+ .pelcro-root .plc-align-top{
3043
3336
  vertical-align: top;
3044
3337
  }
3045
3338
 
3046
- .pelcro-root .plc-align-middle {
3339
+ .pelcro-root .plc-align-middle{
3047
3340
  vertical-align: middle;
3048
3341
  }
3049
3342
 
3050
- .pelcro-root .plc-text-xs {
3343
+ .pelcro-root .plc-text-xs{
3051
3344
  font-size: 0.75rem;
3052
3345
  line-height: 1rem;
3053
3346
  }
3054
3347
 
3055
- .pelcro-root .plc-text-sm {
3348
+ .pelcro-root .plc-text-sm{
3056
3349
  font-size: 0.875rem;
3057
3350
  line-height: 1.25rem;
3058
3351
  }
3059
3352
 
3060
- .pelcro-root .plc-text-base {
3353
+ .pelcro-root .plc-text-base{
3061
3354
  font-size: 1rem;
3062
3355
  line-height: 1.5rem;
3063
3356
  }
3064
3357
 
3065
- .pelcro-root .plc-text-lg {
3358
+ .pelcro-root .plc-text-lg{
3066
3359
  font-size: 1.125rem;
3067
3360
  line-height: 1.75rem;
3068
3361
  }
3069
3362
 
3070
- .pelcro-root .plc-text-xl {
3363
+ .pelcro-root .plc-text-xl{
3071
3364
  font-size: 1.25rem;
3072
3365
  line-height: 1.75rem;
3073
3366
  }
3074
3367
 
3075
- .pelcro-root .plc-text-2xl {
3368
+ .pelcro-root .plc-text-2xl{
3076
3369
  font-size: 1.5rem;
3077
3370
  line-height: 2rem;
3078
3371
  }
3079
3372
 
3080
- .pelcro-root .plc-text-3xl {
3373
+ .pelcro-root .plc-text-3xl{
3081
3374
  font-size: 1.875rem;
3082
3375
  line-height: 2.25rem;
3083
3376
  }
3084
3377
 
3085
- .pelcro-root .plc-text-4xl {
3086
- font-size: 2.25rem;
3087
- line-height: 2.5rem;
3088
- }
3089
-
3090
- .pelcro-root .plc-font-thin {
3378
+ .pelcro-root .plc-font-thin{
3091
3379
  font-weight: 100;
3092
3380
  }
3093
3381
 
3094
- .pelcro-root .plc-font-normal {
3382
+ .pelcro-root .plc-font-normal{
3095
3383
  font-weight: 400;
3096
3384
  }
3097
3385
 
3098
- .pelcro-root .plc-font-medium {
3386
+ .pelcro-root .plc-font-medium{
3099
3387
  font-weight: 500;
3100
3388
  }
3101
3389
 
3102
- .pelcro-root .plc-font-semibold {
3390
+ .pelcro-root .plc-font-semibold{
3103
3391
  font-weight: 600;
3104
3392
  }
3105
3393
 
3106
- .pelcro-root .plc-font-bold {
3394
+ .pelcro-root .plc-font-bold{
3107
3395
  font-weight: 700;
3108
3396
  }
3109
3397
 
3110
- .pelcro-root .plc-uppercase {
3398
+ .pelcro-root .plc-font-extrabold{
3399
+ font-weight: 800;
3400
+ }
3401
+
3402
+ .pelcro-root .plc-uppercase{
3111
3403
  text-transform: uppercase;
3112
3404
  }
3113
3405
 
3114
- .pelcro-root .plc-capitalize {
3406
+ .pelcro-root .plc-capitalize{
3115
3407
  text-transform: capitalize;
3116
3408
  }
3117
3409
 
3118
- .pelcro-root .plc-tracking-wider {
3410
+ .pelcro-root .plc-tracking-wider{
3119
3411
  letter-spacing: 0.05em;
3120
3412
  }
3121
3413
 
3122
- .pelcro-root .plc-tracking-widest {
3414
+ .pelcro-root .plc-tracking-widest{
3123
3415
  letter-spacing: 0.1em;
3124
3416
  }
3125
3417
 
3126
- .pelcro-root .plc-text-primary-400 {
3418
+ .pelcro-root .plc-text-primary-400{
3127
3419
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
3128
3420
  }
3129
3421
 
3130
- .pelcro-root .plc-text-primary-500 {
3422
+ .pelcro-root .plc-text-primary-500{
3131
3423
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3132
3424
  }
3133
3425
 
3134
- .pelcro-root .plc-text-primary-600 {
3426
+ .pelcro-root .plc-text-primary-600{
3135
3427
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
3136
3428
  }
3137
3429
 
3138
- .pelcro-root .plc-text-primary-800 {
3139
- color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 30%));
3430
+ .pelcro-root .plc-text-primary{
3431
+ color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3140
3432
  }
3141
3433
 
3142
- .pelcro-root .plc-text-black {
3434
+ .pelcro-root .plc-text-black{
3143
3435
  --tw-text-opacity: 1;
3144
3436
  color: rgba(0, 0, 0, var(--tw-text-opacity));
3145
3437
  }
3146
3438
 
3147
- .pelcro-root .plc-text-white {
3439
+ .pelcro-root .plc-text-white{
3148
3440
  --tw-text-opacity: 1;
3149
3441
  color: rgba(255, 255, 255, var(--tw-text-opacity));
3150
3442
  }
3151
3443
 
3152
- .pelcro-root .plc-text-gray-400 {
3444
+ .pelcro-root .plc-text-gray-400{
3153
3445
  --tw-text-opacity: 1;
3154
3446
  color: rgba(156, 163, 175, var(--tw-text-opacity));
3155
3447
  }
3156
3448
 
3157
- .pelcro-root .plc-text-gray-500 {
3449
+ .pelcro-root .plc-text-gray-500{
3158
3450
  --tw-text-opacity: 1;
3159
3451
  color: rgba(107, 114, 128, var(--tw-text-opacity));
3160
3452
  }
3161
3453
 
3162
- .pelcro-root .plc-text-gray-600 {
3454
+ .pelcro-root .plc-text-gray-600{
3163
3455
  --tw-text-opacity: 1;
3164
3456
  color: rgba(75, 85, 99, var(--tw-text-opacity));
3165
3457
  }
3166
3458
 
3167
- .pelcro-root .plc-text-gray-700 {
3459
+ .pelcro-root .plc-text-gray-700{
3168
3460
  --tw-text-opacity: 1;
3169
3461
  color: rgba(55, 65, 81, var(--tw-text-opacity));
3170
3462
  }
3171
3463
 
3172
- .pelcro-root .plc-text-gray-900 {
3464
+ .pelcro-root .plc-text-gray-900{
3173
3465
  --tw-text-opacity: 1;
3174
3466
  color: rgba(17, 24, 39, var(--tw-text-opacity));
3175
3467
  }
3176
3468
 
3177
- .pelcro-root .plc-text-red-500 {
3469
+ .pelcro-root .plc-text-red-500{
3178
3470
  --tw-text-opacity: 1;
3179
3471
  color: rgba(180, 48, 43, var(--tw-text-opacity));
3180
3472
  }
3181
3473
 
3182
- .pelcro-root .plc-text-red-700 {
3474
+ .pelcro-root .plc-text-red-700{
3183
3475
  --tw-text-opacity: 1;
3184
3476
  color: rgba(98, 26, 23, var(--tw-text-opacity));
3185
3477
  }
3186
3478
 
3187
- .pelcro-root .plc-text-yellow-700 {
3479
+ .pelcro-root .plc-text-yellow-500{
3480
+ --tw-text-opacity: 1;
3481
+ color: rgba(245, 158, 11, var(--tw-text-opacity));
3482
+ }
3483
+
3484
+ .pelcro-root .plc-text-yellow-700{
3188
3485
  --tw-text-opacity: 1;
3189
3486
  color: rgba(180, 83, 9, var(--tw-text-opacity));
3190
3487
  }
3191
3488
 
3192
- .pelcro-root .plc-text-green-400 {
3489
+ .pelcro-root .plc-text-green-400{
3193
3490
  --tw-text-opacity: 1;
3194
3491
  color: rgba(52, 211, 153, var(--tw-text-opacity));
3195
3492
  }
3196
3493
 
3197
- .pelcro-root .plc-text-green-500 {
3494
+ .pelcro-root .plc-text-green-500{
3198
3495
  --tw-text-opacity: 1;
3199
3496
  color: rgba(16, 185, 129, var(--tw-text-opacity));
3200
3497
  }
3201
3498
 
3202
- .pelcro-root .plc-text-green-600 {
3499
+ .pelcro-root .plc-text-green-600{
3203
3500
  --tw-text-opacity: 1;
3204
3501
  color: rgba(5, 150, 105, var(--tw-text-opacity));
3205
3502
  }
3206
3503
 
3207
- .pelcro-root .plc-text-green-700 {
3504
+ .pelcro-root .plc-text-green-700{
3208
3505
  --tw-text-opacity: 1;
3209
3506
  color: rgba(4, 120, 87, var(--tw-text-opacity));
3210
3507
  }
3211
3508
 
3212
- .pelcro-root .plc-text-blue-400 {
3509
+ .pelcro-root .plc-text-blue-400{
3213
3510
  --tw-text-opacity: 1;
3214
3511
  color: rgba(96, 165, 250, var(--tw-text-opacity));
3215
3512
  }
3216
3513
 
3217
- .pelcro-root .plc-text-blue-500 {
3514
+ .pelcro-root .plc-text-blue-500{
3218
3515
  --tw-text-opacity: 1;
3219
3516
  color: rgba(59, 130, 246, var(--tw-text-opacity));
3220
3517
  }
3221
3518
 
3222
- .pelcro-root .plc-text-blue-700 {
3519
+ .pelcro-root .plc-text-blue-700{
3223
3520
  --tw-text-opacity: 1;
3224
3521
  color: rgba(29, 78, 216, var(--tw-text-opacity));
3225
3522
  }
3226
3523
 
3227
- .pelcro-root .plc-text-orange-700 {
3524
+ .pelcro-root .plc-text-orange-700{
3228
3525
  --tw-text-opacity: 1;
3229
3526
  color: rgba(194, 65, 12, var(--tw-text-opacity));
3230
3527
  }
3231
3528
 
3232
- .pelcro-root .plc-group:hover .group-hover\:plc-text-primary-400 {
3529
+ .pelcro-root .plc-group:hover .group-hover\:plc-text-primary-400{
3233
3530
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
3234
3531
  }
3235
3532
 
3236
- .pelcro-root .hover\:plc-text-primary-500:hover {
3533
+ .pelcro-root .hover\:plc-text-primary-500:hover{
3237
3534
  color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3238
3535
  }
3239
3536
 
3240
- .pelcro-root .hover\:plc-text-black:hover {
3537
+ .pelcro-root .hover\:plc-text-primary-600:hover{
3538
+ color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) - 10%));
3539
+ }
3540
+
3541
+ .pelcro-root .hover\:plc-text-primary:hover{
3542
+ color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), var(--plc-primary-lightness));
3543
+ }
3544
+
3545
+ .pelcro-root .hover\:plc-text-black:hover{
3241
3546
  --tw-text-opacity: 1;
3242
3547
  color: rgba(0, 0, 0, var(--tw-text-opacity));
3243
3548
  }
3244
3549
 
3245
- .pelcro-root .hover\:plc-text-white:hover {
3550
+ .pelcro-root .hover\:plc-text-white:hover{
3246
3551
  --tw-text-opacity: 1;
3247
3552
  color: rgba(255, 255, 255, var(--tw-text-opacity));
3248
3553
  }
3249
3554
 
3250
- .pelcro-root .hover\:plc-text-gray-900:hover {
3555
+ .pelcro-root .hover\:plc-text-gray-900:hover{
3251
3556
  --tw-text-opacity: 1;
3252
3557
  color: rgba(17, 24, 39, var(--tw-text-opacity));
3253
3558
  }
3254
3559
 
3255
- .pelcro-root .focus\:plc-text-black:focus {
3560
+ .pelcro-root .hover\:plc-text-red-500:hover{
3561
+ --tw-text-opacity: 1;
3562
+ color: rgba(180, 48, 43, var(--tw-text-opacity));
3563
+ }
3564
+
3565
+ .pelcro-root .focus\:plc-text-black:focus{
3256
3566
  --tw-text-opacity: 1;
3257
3567
  color: rgba(0, 0, 0, var(--tw-text-opacity));
3258
3568
  }
3259
3569
 
3260
- .pelcro-root .focus\:plc-text-white:focus {
3570
+ .pelcro-root .focus\:plc-text-white:focus{
3261
3571
  --tw-text-opacity: 1;
3262
3572
  color: rgba(255, 255, 255, var(--tw-text-opacity));
3263
3573
  }
3264
3574
 
3265
- .pelcro-root .plc-underline {
3575
+ .pelcro-root .plc-underline{
3266
3576
  text-decoration: underline;
3267
3577
  }
3268
3578
 
3269
- .pelcro-root .plc-no-underline {
3579
+ .pelcro-root .plc-no-underline{
3270
3580
  text-decoration: none;
3271
3581
  }
3272
3582
 
3273
- *, ::before, ::after {
3583
+ .pelcro-root .hover\:plc-no-underline:hover{
3584
+ text-decoration: none;
3585
+ }
3586
+
3587
+ *, ::before, ::after{
3274
3588
  --tw-shadow: 0 0 #0000;
3275
3589
  }
3276
3590
 
3277
- .pelcro-root .plc-shadow-sm {
3591
+ .pelcro-root .plc-shadow-sm{
3278
3592
  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
3279
3593
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3280
3594
  }
3281
3595
 
3282
- .pelcro-root .plc-shadow-md {
3596
+ .pelcro-root .plc-shadow-md{
3283
3597
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
3284
3598
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3285
3599
  }
3286
3600
 
3287
- .pelcro-root .plc-shadow-md_dark {
3601
+ .pelcro-root .plc-shadow-md_dark{
3288
3602
  --tw-shadow: 0 0px 6px -1px rgba(0, 0, 0, 0.1), 0 0px 4px -1px rgba(0, 0, 0, 0.4);
3289
3603
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3290
3604
  }
3291
3605
 
3292
- .pelcro-root .plc-shadow-lg {
3606
+ .pelcro-root .plc-shadow-lg{
3293
3607
  --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
3294
3608
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3295
3609
  }
3296
3610
 
3297
- .pelcro-root .plc-shadow-xl {
3611
+ .pelcro-root .plc-shadow-xl{
3298
3612
  --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
3299
3613
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3300
3614
  }
3301
3615
 
3302
- .pelcro-root .hover\:plc-shadow-none:hover {
3616
+ .pelcro-root .hover\:plc-shadow-sm:hover{
3617
+ --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
3618
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3619
+ }
3620
+
3621
+ .pelcro-root .hover\:plc-shadow-none:hover{
3303
3622
  --tw-shadow: 0 0 #0000;
3304
3623
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3305
3624
  }
3306
3625
 
3307
- .pelcro-root .focus\:plc-shadow-none:focus {
3626
+ .pelcro-root .focus\:plc-shadow-none:focus{
3308
3627
  --tw-shadow: 0 0 #0000;
3309
3628
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3310
3629
  }
3311
3630
 
3312
- .pelcro-root .plc-outline-none {
3631
+ .pelcro-root .plc-outline-none{
3313
3632
  outline: 2px solid transparent;
3314
3633
  outline-offset: 2px;
3315
3634
  }
3316
3635
 
3317
- .pelcro-root .focus-within\:plc-outline-none:focus-within {
3636
+ .pelcro-root .focus-within\:plc-outline-none:focus-within{
3318
3637
  outline: 2px solid transparent;
3319
3638
  outline-offset: 2px;
3320
3639
  }
3321
3640
 
3322
- .pelcro-root .focus\:plc-outline-none:focus {
3641
+ .pelcro-root .focus\:plc-outline-none:focus{
3323
3642
  outline: 2px solid transparent;
3324
3643
  outline-offset: 2px;
3325
3644
  }
3326
3645
 
3327
- *, ::before, ::after {
3646
+ *, ::before, ::after{
3328
3647
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
3329
3648
  --tw-ring-offset-width: 0px;
3330
3649
  --tw-ring-offset-color: #fff;
@@ -3333,410 +3652,322 @@ in order to scope selectors under pelcro-root
3333
3652
  --tw-ring-shadow: 0 0 #0000;
3334
3653
  }
3335
3654
 
3336
- .pelcro-root .plc-ring-1 {
3655
+ .pelcro-root .plc-ring-1{
3337
3656
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3338
3657
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3339
3658
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
3340
3659
  }
3341
3660
 
3342
- .pelcro-root .plc-ring-2 {
3661
+ .pelcro-root .plc-ring-2{
3343
3662
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3344
3663
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3345
3664
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
3346
3665
  }
3347
3666
 
3348
- .pelcro-root .focus\:plc-ring-0:focus {
3667
+ .pelcro-root .focus\:plc-ring-0:focus{
3349
3668
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3350
3669
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3351
3670
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
3352
3671
  }
3353
3672
 
3354
- .pelcro-root .focus\:plc-ring-2:focus {
3673
+ .pelcro-root .focus\:plc-ring-2:focus{
3355
3674
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3356
3675
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3357
3676
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
3358
3677
  }
3359
3678
 
3360
- .pelcro-root .plc-ring-primary-400 {
3679
+ .pelcro-root .plc-ring-primary-400{
3361
3680
  --tw-ring-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 10%));
3362
3681
  }
3363
3682
 
3364
- .pelcro-root .plc-ring-gray-200 {
3683
+ .pelcro-root .plc-ring-gray-200{
3365
3684
  --tw-ring-opacity: 1;
3366
3685
  --tw-ring-color: rgba(229, 231, 235, var(--tw-ring-opacity));
3367
3686
  }
3368
3687
 
3369
- .pelcro-root .plc-ring-red-400 {
3370
- --tw-ring-opacity: 1;
3371
- --tw-ring-color: rgba(209, 70, 65, var(--tw-ring-opacity));
3372
- }
3373
-
3374
- .pelcro-root .focus\:plc-ring-primary-300:focus {
3688
+ .pelcro-root .focus\:plc-ring-primary-300:focus{
3375
3689
  --tw-ring-color: hsl(var(--plc-primary-hue), var(--plc-primary-saturation), calc(var(--plc-primary-lightness) + 20%));
3376
3690
  }
3377
3691
 
3378
- .pelcro-root .focus\:plc-ring-red-500:focus {
3692
+ .pelcro-root .focus\:plc-ring-red-500:focus{
3379
3693
  --tw-ring-opacity: 1;
3380
3694
  --tw-ring-color: rgba(180, 48, 43, var(--tw-ring-opacity));
3381
3695
  }
3382
3696
 
3383
- .pelcro-root .focus\:plc-ring-green-300:focus {
3697
+ .pelcro-root .focus\:plc-ring-green-300:focus{
3384
3698
  --tw-ring-opacity: 1;
3385
3699
  --tw-ring-color: rgba(110, 231, 183, var(--tw-ring-opacity));
3386
3700
  }
3387
3701
 
3388
- .pelcro-root .focus\:plc-ring-blue-400:focus {
3702
+ .pelcro-root .focus\:plc-ring-blue-400:focus{
3389
3703
  --tw-ring-opacity: 1;
3390
3704
  --tw-ring-color: rgba(96, 165, 250, var(--tw-ring-opacity));
3391
3705
  }
3392
3706
 
3393
- .pelcro-root .focus\:plc-ring-blue-500:focus {
3707
+ .pelcro-root .focus\:plc-ring-blue-500:focus{
3394
3708
  --tw-ring-opacity: 1;
3395
3709
  --tw-ring-color: rgba(59, 130, 246, var(--tw-ring-opacity));
3396
3710
  }
3397
3711
 
3398
- .pelcro-root .plc-transition {
3712
+ .pelcro-root .plc-transition-all{
3713
+ transition-property: all;
3714
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3715
+ transition-duration: 150ms;
3716
+ }
3717
+
3718
+ .pelcro-root .plc-transition{
3399
3719
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
3400
3720
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3401
3721
  transition-duration: 150ms;
3402
3722
  }
3403
3723
 
3404
- .pelcro-root .plc-transition-transform {
3724
+ .pelcro-root .plc-transition-transform{
3405
3725
  transition-property: transform;
3406
3726
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3407
3727
  transition-duration: 150ms;
3408
3728
  }
3409
3729
 
3410
- .pelcro-root .plc-duration-500 {
3730
+ .pelcro-root .plc-duration-500{
3411
3731
  transition-duration: 500ms;
3412
3732
  }
3413
3733
 
3414
- .pelcro-root .plc-ease-out {
3734
+ .pelcro-root .plc-ease-out{
3415
3735
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
3416
3736
  }
3417
3737
 
3418
- @media (min-width: 640px) {
3419
- .pelcro-root .sm\:plc-m-4 {
3420
- margin: 1rem;
3738
+ /* Hide scrollbar for Chrome, Safari and Opera */
3739
+
3740
+ .no-scrollbar::-webkit-scrollbar {
3741
+ display: none;
3742
+ }
3743
+
3744
+ /* Hide scrollbar for IE, Edge and Firefox */
3745
+
3746
+ .no-scrollbar {
3747
+ -ms-overflow-style: none; /* IE and Edge */
3748
+ scrollbar-width: none; /* Firefox */
3749
+ }
3750
+
3751
+ @media (min-width: 425px){
3752
+ }
3753
+
3754
+ @media (min-width: 640px){
3755
+ .pelcro-root .sm\:plc-top-1\/2{
3756
+ top: 50%;
3757
+ }
3758
+
3759
+ .pelcro-root .sm\:plc--right-14{
3760
+ right: -3.5rem;
3421
3761
  }
3422
3762
 
3423
- .pelcro-root .sm\:plc-mb-0 {
3424
- margin-bottom: 0px;
3763
+ .pelcro-root .sm\:plc--left-14{
3764
+ left: -3.5rem;
3425
3765
  }
3426
3766
 
3427
- .pelcro-root .sm\:plc-ml-2 {
3767
+ .pelcro-root .sm\:plc-m-4{
3768
+ margin: 1rem;
3769
+ }
3770
+
3771
+ .pelcro-root .sm\:plc-ml-2{
3428
3772
  margin-left: 0.5rem;
3429
3773
  }
3430
3774
 
3431
- .pelcro-root .sm\:plc-ml-6 {
3775
+ .pelcro-root .sm\:plc-ml-6{
3432
3776
  margin-left: 1.5rem;
3433
3777
  }
3434
3778
 
3435
- .pelcro-root .sm\:plc-ml-8 {
3779
+ .pelcro-root .sm\:plc-ml-8{
3436
3780
  margin-left: 2rem;
3437
3781
  }
3438
3782
 
3439
- .pelcro-root .sm\:plc-flex {
3783
+ .pelcro-root .sm\:plc-flex{
3440
3784
  display: flex;
3441
3785
  }
3442
3786
 
3443
- .pelcro-root .sm\:plc-inline-grid {
3444
- display: inline-grid;
3445
- }
3446
-
3447
- .pelcro-root .sm\:plc-h-8 {
3787
+ .pelcro-root .sm\:plc-h-8{
3448
3788
  height: 2rem;
3449
3789
  }
3450
3790
 
3451
- .pelcro-root .sm\:plc-h-96 {
3791
+ .pelcro-root .sm\:plc-h-96{
3452
3792
  height: 24rem;
3453
3793
  }
3454
3794
 
3455
- .pelcro-root .sm\:plc-w-auto {
3795
+ .pelcro-root .sm\:plc-w-auto{
3456
3796
  width: auto;
3457
3797
  }
3458
3798
 
3459
- .pelcro-root .sm\:plc-w-1\/2 {
3460
- width: 50%;
3799
+ .pelcro-root .sm\:plc-max-w-md{
3800
+ max-width: 28rem;
3461
3801
  }
3462
3802
 
3463
- .pelcro-root .sm\:plc-max-w-md {
3464
- max-width: 28rem;
3803
+ .pelcro-root .sm\:plc-max-w-90\%{
3804
+ max-width: 90%;
3805
+ }
3806
+
3807
+ .pelcro-root .sm\:plc--translate-y-1\/2{
3808
+ --tw-translate-y: -50%;
3465
3809
  }
3466
3810
 
3467
- .pelcro-root .sm\:plc-flex-row {
3811
+ .pelcro-root .sm\:plc-flex-row{
3468
3812
  flex-direction: row;
3469
3813
  }
3470
3814
 
3471
- .pelcro-root .sm\:plc-space-x-2 > :not([hidden]) ~ :not([hidden]) {
3815
+ .pelcro-root .sm\:plc-space-x-2 > :not([hidden]) ~ :not([hidden]){
3472
3816
  --tw-space-x-reverse: 0;
3473
3817
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
3474
3818
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
3475
3819
  }
3476
3820
 
3477
- .pelcro-root .sm\:plc-space-y-0 > :not([hidden]) ~ :not([hidden]) {
3821
+ .pelcro-root .sm\:plc-space-y-0 > :not([hidden]) ~ :not([hidden]){
3478
3822
  --tw-space-y-reverse: 0;
3479
3823
  margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
3480
3824
  margin-bottom: calc(0px * var(--tw-space-y-reverse));
3481
3825
  }
3482
3826
 
3483
- .pelcro-root .sm\:plc-p-2 {
3827
+ .pelcro-root .sm\:plc-p-2{
3484
3828
  padding: 0.5rem;
3485
3829
  }
3486
3830
 
3487
- .pelcro-root .sm\:plc-px-8 {
3831
+ .pelcro-root .sm\:plc-px-8{
3488
3832
  padding-left: 2rem;
3489
3833
  padding-right: 2rem;
3490
3834
  }
3491
3835
 
3492
- .pelcro-root .sm\:plc-pl-8 {
3493
- padding-left: 2rem;
3836
+ .pelcro-root .sm\:plc-px-10{
3837
+ padding-left: 2.5rem;
3838
+ padding-right: 2.5rem;
3494
3839
  }
3495
- }
3496
3840
 
3497
- @media (min-width: 768px) {
3498
- }
3499
-
3500
- @media (min-width: 1024px) {
3501
- .pelcro-root .lg\:plc-w-3\/12 {
3502
- width: 25%;
3841
+ .pelcro-root .sm\:plc-px-14{
3842
+ padding-left: 3.5rem;
3843
+ padding-right: 3.5rem;
3503
3844
  }
3504
3845
 
3505
- .pelcro-root .lg\:plc-w-9\/12 {
3506
- width: 75%;
3846
+ .pelcro-root .sm\:plc-pl-8{
3847
+ padding-left: 2rem;
3507
3848
  }
3508
3849
  }
3509
3850
 
3510
- @media (min-width: 1280px) {
3511
- }
3512
-
3513
- @media (min-width: 1536px) {
3514
- }
3515
-
3516
- /* purgecss start ignore */
3517
-
3518
- .alice-carousel .animated {
3519
- animation-fill-mode: both;
3520
- }
3521
-
3522
- .alice-carousel .animated-out {
3523
- z-index: 1;
3524
- }
3525
-
3526
- .alice-carousel .fadeOut {
3527
- animation-name: fadeOut;
3528
- }
3529
-
3530
- @keyframes fadeOut {
3531
- 0% {
3532
- opacity: 1;
3851
+ @media (min-width: 768px){
3852
+ .pelcro-root .md\:plc-top-5{
3853
+ top: 1.25rem;
3533
3854
  }
3534
3855
 
3535
- 100% {
3536
- opacity: 0;
3537
- visibility: hidden;
3856
+ .pelcro-root .md\:plc-right-10{
3857
+ right: 2.5rem;
3538
3858
  }
3539
- }
3540
-
3541
- .alice-carousel {
3542
- position: relative;
3543
- width: 100%;
3544
- margin: auto;
3545
- direction: ltr;
3546
- }
3547
3859
 
3548
- .alice-carousel__wrapper {
3549
- position: relative;
3550
- overflow-x: hidden;
3551
- overflow-y: hidden;
3552
- box-sizing: border-box;
3553
- width: 100%;
3554
- height: auto;
3555
- }
3556
-
3557
- .alice-carousel__stage {
3558
- position: relative;
3559
- box-sizing: border-box;
3560
- width: 100%;
3561
- height: 100%;
3562
- margin: 0;
3563
- padding: 0;
3564
- white-space: nowrap;
3565
- transform-style: flat;
3566
- -webkit-transform-style: flat;
3567
- backface-visibility: hidden;
3568
- -webkit-backface-visibility: hidden;
3569
- }
3860
+ .pelcro-root .md\:plc-mx-auto{
3861
+ margin-left: auto;
3862
+ margin-right: auto;
3863
+ }
3570
3864
 
3571
- .alice-carousel__stage-item {
3572
- position: relative;
3573
- display: inline-block;
3574
- padding: 0;
3575
- margin: 0;
3576
- box-sizing: border-box;
3577
- width: 100%;
3578
- height: 100%;
3579
- vertical-align: top;
3580
- white-space: normal;
3581
- line-height: 0;
3582
- }
3865
+ .pelcro-root .md\:plc-mt-40{
3866
+ margin-top: 10rem;
3867
+ }
3583
3868
 
3584
- .alice-carousel__stage-item * {
3585
- line-height: initial;
3586
- }
3869
+ .pelcro-root .md\:plc-mb-20{
3870
+ margin-bottom: 5rem;
3871
+ }
3587
3872
 
3588
- .alice-carousel__stage-item.__hidden {
3589
- opacity: 0;
3590
- overflow: hidden;
3591
- }
3873
+ .pelcro-root .md\:plc-table-cell{
3874
+ display: table-cell;
3875
+ }
3592
3876
 
3593
- .alice-carousel__prev-btn,
3594
- .alice-carousel__next-btn {
3595
- display: inline-block;
3596
- box-sizing: border-box;
3597
- width: 50%;
3598
- padding: 10px 5px;
3599
- }
3877
+ .pelcro-root .md\:plc-hidden{
3878
+ display: none;
3879
+ }
3600
3880
 
3601
- .alice-carousel__prev-btn [data-area]::after,
3602
- .alice-carousel__next-btn [data-area]::after {
3603
- position: relative;
3604
- content: attr(data-area);
3605
- text-transform: capitalize;
3606
- }
3881
+ .pelcro-root .md\:plc-w-1\/5{
3882
+ width: 20%;
3883
+ }
3607
3884
 
3608
- .alice-carousel__prev-btn {
3609
- text-align: right;
3610
- }
3885
+ .pelcro-root .md\:plc-w-2\/5{
3886
+ width: 40%;
3887
+ }
3611
3888
 
3612
- .alice-carousel__prev-btn-item,
3613
- .alice-carousel__next-btn-item {
3614
- display: inline-block;
3615
- cursor: pointer;
3616
- padding: 5px;
3617
- margin: 0;
3618
- color: #465798;
3619
- }
3889
+ .pelcro-root .md\:plc-w-1\/12{
3890
+ width: 8.333333%;
3891
+ }
3620
3892
 
3621
- .alice-carousel__prev-btn-item:hover,
3622
- .alice-carousel__next-btn-item:hover {
3623
- color: darkred;
3624
- }
3893
+ .pelcro-root .md\:plc-w-2\/12{
3894
+ width: 16.666667%;
3895
+ }
3625
3896
 
3626
- .alice-carousel__prev-btn-item.__inactive,
3627
- .alice-carousel__next-btn-item.__inactive {
3628
- opacity: 0.4;
3629
- pointer-events: none;
3630
- }
3897
+ .pelcro-root .md\:plc-w-3\/12{
3898
+ width: 25%;
3899
+ }
3631
3900
 
3632
- .alice-carousel__play-btn {
3633
- position: absolute;
3634
- top: 30px;
3635
- left: 20px;
3636
- display: inline-block;
3637
- }
3901
+ .pelcro-root .md\:plc-max-w-xl{
3902
+ max-width: 36rem;
3903
+ }
3638
3904
 
3639
- .alice-carousel__play-btn:hover {
3640
- cursor: pointer;
3641
- }
3905
+ .pelcro-root .md\:plc-max-w-60\%{
3906
+ max-width: 60%;
3907
+ }
3642
3908
 
3643
- .alice-carousel__play-btn-wrapper {
3644
- position: relative;
3645
- width: 32px;
3646
- height: 32px;
3647
- padding: 10px;
3648
- border-radius: 50%;
3649
- background-color: #fff;
3650
- }
3909
+ .pelcro-root .md\:plc-max-w-70\%{
3910
+ max-width: 70%;
3911
+ }
3651
3912
 
3652
- .alice-carousel__play-btn-item {
3653
- position: absolute;
3654
- width: 32px;
3655
- height: 32px;
3656
- cursor: pointer;
3657
- border: 0;
3658
- outline: none;
3659
- background: transparent;
3660
- }
3913
+ .pelcro-root .md\:plc-max-w-80\%{
3914
+ max-width: 80%;
3915
+ }
3661
3916
 
3662
- .alice-carousel__play-btn-item::before, .alice-carousel__play-btn-item::after {
3663
- position: absolute;
3664
- pointer-events: none;
3665
- display: block;
3666
- width: 0;
3667
- height: 0;
3668
- content: "";
3669
- transition: all 0.4s linear;
3670
- border-width: 8px 0 8px 15px;
3671
- border-style: solid;
3672
- border-color: transparent;
3673
- border-left-color: #465798;
3674
- }
3917
+ .pelcro-root .md\:plc-flex-row{
3918
+ flex-direction: row;
3919
+ }
3675
3920
 
3676
- .alice-carousel__play-btn-item::before {
3677
- left: 5px;
3678
- height: 14px;
3679
- }
3921
+ .pelcro-root .md\:plc-space-x-3 > :not([hidden]) ~ :not([hidden]){
3922
+ --tw-space-x-reverse: 0;
3923
+ margin-right: calc(0.75rem * var(--tw-space-x-reverse));
3924
+ margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
3925
+ }
3680
3926
 
3681
- .alice-carousel__play-btn-item::after {
3682
- top: 7px;
3683
- left: 18px;
3684
- }
3927
+ .pelcro-root .md\:plc-space-y-0 > :not([hidden]) ~ :not([hidden]){
3928
+ --tw-space-y-reverse: 0;
3929
+ margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
3930
+ margin-bottom: calc(0px * var(--tw-space-y-reverse));
3931
+ }
3685
3932
 
3686
- .alice-carousel__play-btn-item.__pause::before, .alice-carousel__play-btn-item.__pause::after {
3687
- height: 30px;
3688
- border-width: 0 0 0 10px;
3689
- }
3933
+ .pelcro-root .md\:plc-whitespace-normal{
3934
+ white-space: normal;
3935
+ }
3690
3936
 
3691
- .alice-carousel__play-btn-item.__pause::after {
3692
- top: 0;
3693
- left: 18px;
3694
- }
3937
+ .pelcro-root .md\:plc-whitespace-nowrap{
3938
+ white-space: nowrap;
3939
+ }
3695
3940
 
3696
- .alice-carousel__dots {
3697
- margin: 30px 3px 5px;
3698
- padding: 0;
3699
- list-style: none;
3700
- text-align: center;
3701
- }
3941
+ .pelcro-root .md\:plc-p-8{
3942
+ padding: 2rem;
3943
+ }
3702
3944
 
3703
- .alice-carousel__dots > li {
3704
- display: inline-block;
3945
+ .pelcro-root .md\:plc-px-0{
3946
+ padding-left: 0px;
3947
+ padding-right: 0px;
3948
+ }
3705
3949
  }
3706
3950
 
3707
- .alice-carousel__dots-item:not(.__custom) {
3708
- width: 8px;
3709
- height: 8px;
3710
- cursor: pointer;
3711
- border-radius: 50%;
3712
- background-color: #e0e4fb;
3713
- }
3951
+ @media (min-width: 1024px){
3952
+ .pelcro-root .lg\:plc-hidden{
3953
+ display: none;
3954
+ }
3714
3955
 
3715
- .alice-carousel__dots-item:not(.__custom):not(:last-child) {
3716
- margin-right: 20px;
3717
- }
3956
+ .pelcro-root .lg\:plc-w-3\/12{
3957
+ width: 25%;
3958
+ }
3718
3959
 
3719
- .alice-carousel__dots-item:not(.__custom):hover, .alice-carousel__dots-item:not(.__custom).__active {
3720
- background-color: #6e7ebc;
3960
+ .pelcro-root .lg\:plc-w-9\/12{
3961
+ width: 75%;
3962
+ }
3721
3963
  }
3722
3964
 
3723
- .alice-carousel__slide-info {
3724
- position: absolute;
3725
- top: 20px;
3726
- right: 20px;
3727
- display: inline-block;
3728
- padding: 5px 10px;
3729
- color: #465798;
3730
- border-radius: 5px;
3731
- background-color: rgba(224, 228, 251, 0.6);
3965
+ @media (min-width: 1280px){
3732
3966
  }
3733
3967
 
3734
- .alice-carousel__slide-info-item {
3735
- vertical-align: middle;
3736
- line-height: 0;
3968
+ @media (min-width: 1536px){
3737
3969
  }
3738
3970
 
3739
- /* purgecss end ignore */
3740
3971
  /* purgecss start ignore */
3741
3972
 
3742
3973
  .toggle-switch {