@skyux/theme 11.11.2 → 11.13.0

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.
@@ -535,265 +535,531 @@
535
535
  overflow: hidden;
536
536
  }
537
537
 
538
+ .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn {
539
+ --sky-override-borderless-icon-size: 26px;
540
+ --sky-override-button-padding: 9px 21px;
541
+ --sky-override-button-link-inline-color-disabled: var(
542
+ --sky-color-text-action
543
+ );
544
+ --sky-override-button-link-inline-color-hover-active: var(
545
+ --sky-text-color-action-primary-hover
546
+ );
547
+ --sky-override-button-link-inline-border-radius: 0;
548
+ --sky-override-button-link-inline-font-size: var(--sky-font-size-body-m);
549
+ --sky-override-button-link-inline-vertical-align: top;
550
+ --sky-override-button-icon-borderless-padding: 1px;
551
+ --sky-override-button-icon-padding: 9px 15px;
552
+ --sky-override-button-primary-disabled-box-shadow: inset 0 0 0
553
+ var(--sky-border-width-action-focus)
554
+ var(--sky-color-border-action-primary-focus),
555
+ var(--sky-elevation-focus);
556
+ --sky-override-button-icon-disabled-box-shadow: inset 0 0 0
557
+ var(--sky-border-width-action-focus)
558
+ var(--sky-color-border-action-secondary-focus),
559
+ var(--sky-elevation-focus);
560
+ --sky-override-button-danger-disabled-box-shadow: inset 0 0 0
561
+ var(--sky-border-width-action-focus)
562
+ var(--sky-color-border-action-danger-focus),
563
+ var(--sky-elevation-focus);
564
+ --sky-override-button-tertiary-disabled-box-shadow: inset 0 0 0
565
+ var(--sky-border-width-action-focus)
566
+ var(--sky-color-border-action-tertiary-focus),
567
+ var(--sky-elevation-focus,);
568
+ --sky-override-button-link-inline-disabled-box-shadow: 0 0 0
569
+ var(--sky-border-width-action-focus)
570
+ var(--sky-color-border-action-tertiary-focus),
571
+ var(--sky-elevation-focus);
572
+ --sky-override-button-borderless-inline-disabled-box-shadow: 0 0 0
573
+ var(--sky-border-width-action-focus)
574
+ var(--sky-color-border-action-tertiary-focus),
575
+ var(--sky-elevation-focus);
576
+ }
577
+ .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn.sky-btn-link-inline, .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn.sky-btn-borderless-inline {
578
+ --sky-override-button-opacity-disabled: 0.65;
579
+ }
580
+ .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn:not(.sky-btn-link-inline):not(.sky-btn-borderless-inline) {
581
+ --sky-override-button-line-height: calc(20 / 14);
582
+ }
583
+ .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn.sky-btn-link-inline, .sky-theme-modern:not(.sky-theme-brand-blackbaud) .sky-btn.sky-btn-borderless-inline {
584
+ --sky-override-button-line-height: normal;
585
+ }
586
+
538
587
  .sky-theme-modern .sky-btn {
539
588
  border: none;
540
- border-radius: 6px;
541
- font-size: 16px;
589
+ border-radius: var(--sky-border-radius-s);
590
+ font-size: var(--sky-font-size-body-m);
542
591
  transition: box-shadow 150ms;
592
+ line-height: var(--sky-override-button-line-height, var(--sky-font-line_height-body-m));
543
593
  }
544
- .sky-theme-modern .sky-btn-default {
594
+ .sky-theme-modern .sky-btn-default,
595
+ .sky-theme-modern .sky-btn-primary,
596
+ .sky-theme-modern .sky-btn-danger,
597
+ .sky-theme-modern .sky-btn-link,
598
+ .sky-theme-modern .sky-btn-borderless {
599
+ padding: var(--sky-override-button-padding, var(--sky-space-inset-pillarbox-1_2-top-m) var(--sky-space-inset-pillarbox-1_2-right-m) var(--sky-space-inset-pillarbox-1_2-bottom-m) var(--sky-space-inset-pillarbox-1_2-left-m));
600
+ }
601
+ .sky-theme-modern .sky-btn-default,
602
+ .sky-theme-modern .sky-btn-primary,
603
+ .sky-theme-modern .sky-btn-danger,
604
+ .sky-theme-modern .sky-btn-link,
605
+ .sky-theme-modern .sky-btn-borderless,
606
+ .sky-theme-modern .sky-btn-icon-borderless,
607
+ .sky-theme-modern .sky-btn-icon,
608
+ .sky-theme-modern .sky-btn-link-inline,
609
+ .sky-theme-modern .sky-btn-borderless-inline {
545
610
  border: none;
546
- box-shadow: inset 0 0 0 1px #d2d2d2;
547
- background-color: #ffffff;
548
- color: #212327;
549
- padding: 9px 21px;
611
+ outline: none;
550
612
  }
551
- .sky-theme-modern .sky-btn-default:hover {
552
- border: none;
553
- box-shadow: inset 0 0 0 1px #1870B8;
613
+ .sky-theme-modern .sky-btn-default:hover,
614
+ .sky-theme-modern .sky-btn-primary:hover,
615
+ .sky-theme-modern .sky-btn-danger:hover,
616
+ .sky-theme-modern .sky-btn-link:hover,
617
+ .sky-theme-modern .sky-btn-borderless:hover,
618
+ .sky-theme-modern .sky-btn-icon-borderless:hover,
619
+ .sky-theme-modern .sky-btn-icon:hover,
620
+ .sky-theme-modern .sky-btn-link-inline:hover,
621
+ .sky-theme-modern .sky-btn-borderless-inline:hover {
554
622
  text-decoration: none;
555
623
  }
556
- .sky-theme-modern .sky-btn-default:hover, .sky-theme-modern .sky-btn-default:active, .sky-theme-modern .sky-btn-default.sky-btn-active {
557
- color: #212327;
558
- }
559
- .sky-theme-modern .sky-btn-default:active, .sky-theme-modern .sky-btn-default.sky-btn-active {
624
+ .sky-theme-modern .sky-btn-default.sky-btn-disabled, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-default[disabled], .sky-theme-modern .sky-btn-default[disabled]:hover, .sky-theme-modern .sky-btn-default[disabled]:focus-visible, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-default[disabled]:active, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active,
625
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled,
626
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover,
627
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible,
628
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus,
629
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active,
630
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active,
631
+ .sky-theme-modern .sky-btn-primary[disabled],
632
+ .sky-theme-modern .sky-btn-primary[disabled]:hover,
633
+ .sky-theme-modern .sky-btn-primary[disabled]:focus-visible,
634
+ .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus,
635
+ .sky-theme-modern .sky-btn-primary[disabled]:active,
636
+ .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active,
637
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled,
638
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover,
639
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible,
640
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus,
641
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active,
642
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active,
643
+ .sky-theme-modern .sky-btn-danger[disabled],
644
+ .sky-theme-modern .sky-btn-danger[disabled]:hover,
645
+ .sky-theme-modern .sky-btn-danger[disabled]:focus-visible,
646
+ .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus,
647
+ .sky-theme-modern .sky-btn-danger[disabled]:active,
648
+ .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active,
649
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled,
650
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover,
651
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible,
652
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus,
653
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:active,
654
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active,
655
+ .sky-theme-modern .sky-btn-link[disabled],
656
+ .sky-theme-modern .sky-btn-link[disabled]:hover,
657
+ .sky-theme-modern .sky-btn-link[disabled]:focus-visible,
658
+ .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus,
659
+ .sky-theme-modern .sky-btn-link[disabled]:active,
660
+ .sky-theme-modern .sky-btn-link[disabled].sky-btn-active,
661
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled,
662
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:hover,
663
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:focus-visible,
664
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-focus,
665
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:active,
666
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-active,
667
+ .sky-theme-modern .sky-btn-borderless[disabled],
668
+ .sky-theme-modern .sky-btn-borderless[disabled]:hover,
669
+ .sky-theme-modern .sky-btn-borderless[disabled]:focus-visible,
670
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-focus,
671
+ .sky-theme-modern .sky-btn-borderless[disabled]:active,
672
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-active,
673
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled,
674
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:hover,
675
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:focus-visible,
676
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus,
677
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:active,
678
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active,
679
+ .sky-theme-modern .sky-btn-icon-borderless[disabled],
680
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:hover,
681
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:focus-visible,
682
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus,
683
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:active,
684
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active,
685
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled,
686
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover,
687
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible,
688
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-focus,
689
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:active,
690
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-active,
691
+ .sky-theme-modern .sky-btn-icon[disabled],
692
+ .sky-theme-modern .sky-btn-icon[disabled]:hover,
693
+ .sky-theme-modern .sky-btn-icon[disabled]:focus-visible,
694
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus,
695
+ .sky-theme-modern .sky-btn-icon[disabled]:active,
696
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active,
697
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled,
698
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover,
699
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible,
700
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus,
701
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active,
702
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active,
703
+ .sky-theme-modern .sky-btn-link-inline[disabled],
704
+ .sky-theme-modern .sky-btn-link-inline[disabled]:hover,
705
+ .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible,
706
+ .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus,
707
+ .sky-theme-modern .sky-btn-link-inline[disabled]:active,
708
+ .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active,
709
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled,
710
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:hover,
711
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:focus-visible,
712
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-focus,
713
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:active,
714
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-active,
715
+ .sky-theme-modern .sky-btn-borderless-inline[disabled],
716
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:hover,
717
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:focus-visible,
718
+ .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-focus,
719
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:active,
720
+ .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-active {
560
721
  border: none;
561
- box-shadow: inset 0 0 0 2px #1870B8;
562
- background-image: none;
722
+ opacity: var(--sky-override-button-opacity-disabled, 1);
723
+ color: var(--sky-color-text-deemphasized);
563
724
  }
564
- .sky-theme-modern .sky-btn-default.sky-btn-disabled, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-default[disabled], .sky-theme-modern .sky-btn-default[disabled]:hover, .sky-theme-modern .sky-btn-default[disabled]:focus-visible, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-default[disabled]:active, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active {
565
- border: none;
566
- box-shadow: inset 0 0 0 1px #d2d2d2;
567
- background-color: #ededee;
568
- color: #686c73;
569
- opacity: 1;
725
+ .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-link-inline, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover.sky-btn-link-inline, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible.sky-btn-link-inline, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active.sky-btn-link-inline, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active.sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled].sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled]:hover.sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled]:focus-visible.sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus.sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled]:active.sky-btn-link-inline, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active.sky-btn-link-inline,
726
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-link-inline,
727
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover.sky-btn-link-inline,
728
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible.sky-btn-link-inline,
729
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
730
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active.sky-btn-link-inline,
731
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
732
+ .sky-theme-modern .sky-btn-primary[disabled].sky-btn-link-inline,
733
+ .sky-theme-modern .sky-btn-primary[disabled]:hover.sky-btn-link-inline,
734
+ .sky-theme-modern .sky-btn-primary[disabled]:focus-visible.sky-btn-link-inline,
735
+ .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus.sky-btn-link-inline,
736
+ .sky-theme-modern .sky-btn-primary[disabled]:active.sky-btn-link-inline,
737
+ .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active.sky-btn-link-inline,
738
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-link-inline,
739
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover.sky-btn-link-inline,
740
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible.sky-btn-link-inline,
741
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
742
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active.sky-btn-link-inline,
743
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
744
+ .sky-theme-modern .sky-btn-danger[disabled].sky-btn-link-inline,
745
+ .sky-theme-modern .sky-btn-danger[disabled]:hover.sky-btn-link-inline,
746
+ .sky-theme-modern .sky-btn-danger[disabled]:focus-visible.sky-btn-link-inline,
747
+ .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus.sky-btn-link-inline,
748
+ .sky-theme-modern .sky-btn-danger[disabled]:active.sky-btn-link-inline,
749
+ .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active.sky-btn-link-inline,
750
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-link-inline,
751
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover.sky-btn-link-inline,
752
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible.sky-btn-link-inline,
753
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
754
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:active.sky-btn-link-inline,
755
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
756
+ .sky-theme-modern .sky-btn-link[disabled].sky-btn-link-inline,
757
+ .sky-theme-modern .sky-btn-link[disabled]:hover.sky-btn-link-inline,
758
+ .sky-theme-modern .sky-btn-link[disabled]:focus-visible.sky-btn-link-inline,
759
+ .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus.sky-btn-link-inline,
760
+ .sky-theme-modern .sky-btn-link[disabled]:active.sky-btn-link-inline,
761
+ .sky-theme-modern .sky-btn-link[disabled].sky-btn-active.sky-btn-link-inline,
762
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-link-inline,
763
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:hover.sky-btn-link-inline,
764
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:focus-visible.sky-btn-link-inline,
765
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
766
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:active.sky-btn-link-inline,
767
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
768
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-link-inline,
769
+ .sky-theme-modern .sky-btn-borderless[disabled]:hover.sky-btn-link-inline,
770
+ .sky-theme-modern .sky-btn-borderless[disabled]:focus-visible.sky-btn-link-inline,
771
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-focus.sky-btn-link-inline,
772
+ .sky-theme-modern .sky-btn-borderless[disabled]:active.sky-btn-link-inline,
773
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-active.sky-btn-link-inline,
774
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-link-inline,
775
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:hover.sky-btn-link-inline,
776
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:focus-visible.sky-btn-link-inline,
777
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
778
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:active.sky-btn-link-inline,
779
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
780
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-link-inline,
781
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:hover.sky-btn-link-inline,
782
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:focus-visible.sky-btn-link-inline,
783
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus.sky-btn-link-inline,
784
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:active.sky-btn-link-inline,
785
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active.sky-btn-link-inline,
786
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-link-inline,
787
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover.sky-btn-link-inline,
788
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible.sky-btn-link-inline,
789
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
790
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:active.sky-btn-link-inline,
791
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
792
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-link-inline,
793
+ .sky-theme-modern .sky-btn-icon[disabled]:hover.sky-btn-link-inline,
794
+ .sky-theme-modern .sky-btn-icon[disabled]:focus-visible.sky-btn-link-inline,
795
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus.sky-btn-link-inline,
796
+ .sky-theme-modern .sky-btn-icon[disabled]:active.sky-btn-link-inline,
797
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active.sky-btn-link-inline,
798
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-link-inline,
799
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover.sky-btn-link-inline,
800
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible.sky-btn-link-inline,
801
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
802
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active.sky-btn-link-inline,
803
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
804
+ .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-link-inline,
805
+ .sky-theme-modern .sky-btn-link-inline[disabled]:hover.sky-btn-link-inline,
806
+ .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible.sky-btn-link-inline,
807
+ .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus.sky-btn-link-inline,
808
+ .sky-theme-modern .sky-btn-link-inline[disabled]:active.sky-btn-link-inline,
809
+ .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active.sky-btn-link-inline,
810
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-link-inline,
811
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:hover.sky-btn-link-inline,
812
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:focus-visible.sky-btn-link-inline,
813
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
814
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:active.sky-btn-link-inline,
815
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
816
+ .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-link-inline,
817
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:hover.sky-btn-link-inline,
818
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:focus-visible.sky-btn-link-inline,
819
+ .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-focus.sky-btn-link-inline,
820
+ .sky-theme-modern .sky-btn-borderless-inline[disabled]:active.sky-btn-link-inline,
821
+ .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-active.sky-btn-link-inline {
822
+ color: var(--sky-override-button-link-inline-color-disabled, var(--sky-color-text-default));
570
823
  }
571
- .sky-theme-modern .sky-btn-default:focus-visible {
572
- outline: none;
824
+ .sky-theme-modern .sky-btn-icon {
825
+ padding: var(--sky-override-button-icon-padding, var(--sky-space-inset-balanced-s));
573
826
  }
574
- .sky-theme-modern .sky-btn-default:focus-visible:not(:active) {
575
- border: none;
576
- box-shadow: inset 0 0 0 2px #1870B8, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
827
+ .sky-theme-modern .sky-btn-default,
828
+ .sky-theme-modern .sky-btn-icon {
829
+ background-color: var(--sky-color-background-action-secondary-base);
830
+ color: var(--sky-color-text-default);
831
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-secondary-base);
832
+ }
833
+ .sky-theme-modern .sky-btn-default:hover,
834
+ .sky-theme-modern .sky-btn-icon:hover {
835
+ background-color: var(--sky-color-background-action-secondary-hover);
836
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-secondary-hover);
837
+ }
838
+ .sky-theme-modern .sky-btn-default:active, .sky-theme-modern .sky-btn-default.sky-btn-active,
839
+ .sky-theme-modern .sky-btn-icon:active,
840
+ .sky-theme-modern .sky-btn-icon.sky-btn-active {
841
+ background-color: var(--sky-color-background-action-secondary-active);
842
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-active);
843
+ }
844
+ .sky-theme-modern .sky-btn-default:focus-visible:not(:active),
845
+ .sky-theme-modern .sky-btn-icon:focus-visible:not(:active) {
846
+ background-color: var(--sky-color-background-action-secondary-focus);
847
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-secondary-focus), var(--sky-elevation-focus);
848
+ }
849
+ .sky-theme-modern .sky-btn-default.sky-btn-disabled, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-default[disabled], .sky-theme-modern .sky-btn-default[disabled]:hover, .sky-theme-modern .sky-btn-default[disabled]:focus-visible, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-default[disabled]:active, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active,
850
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled,
851
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover,
852
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible,
853
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-focus,
854
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:active,
855
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-active,
856
+ .sky-theme-modern .sky-btn-icon[disabled],
857
+ .sky-theme-modern .sky-btn-icon[disabled]:hover,
858
+ .sky-theme-modern .sky-btn-icon[disabled]:focus-visible,
859
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus,
860
+ .sky-theme-modern .sky-btn-icon[disabled]:active,
861
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active {
862
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled);
863
+ background-color: var(--sky-color-background-action-secondary-disabled);
864
+ }
865
+ .sky-theme-modern .sky-btn-default.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus),
866
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:is(:focus-visible, .sky-btn-focus),
867
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus),
868
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus),
869
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus),
870
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus),
871
+ .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus),
872
+ .sky-theme-modern .sky-btn-icon[disabled]:is(:focus-visible, .sky-btn-focus),
873
+ .sky-theme-modern .sky-btn-icon[disabled]:hover:is(:focus-visible, .sky-btn-focus),
874
+ .sky-theme-modern .sky-btn-icon[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus),
875
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
876
+ .sky-theme-modern .sky-btn-icon[disabled]:active:is(:focus-visible, .sky-btn-focus),
877
+ .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
878
+ box-shadow: var(--sky-override-button-icon-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled));
577
879
  }
578
880
  .sky-theme-modern .sky-btn-primary {
579
- border: none;
580
- box-shadow: inset 0 0 0 1px #1870B8;
581
- background-color: #1870B8;
582
- color: #ffffff;
583
- padding: 9px 21px;
881
+ background-color: var(--sky-color-background-action-primary-base);
882
+ color: var(--sky-color-text-inverse);
883
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-primary-base);
584
884
  }
585
885
  .sky-theme-modern .sky-btn-primary:hover {
586
- border: none;
587
- box-shadow: inset 0 0 0 1px #c1e8fb;
588
- text-decoration: none;
589
- }
590
- .sky-theme-modern .sky-btn-primary:hover, .sky-theme-modern .sky-btn-primary:active, .sky-theme-modern .sky-btn-primary.sky-btn-active {
591
- color: #ffffff;
886
+ background-color: var(--sky-color-background-action-primary-hover);
887
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-primary-hover);
592
888
  }
593
889
  .sky-theme-modern .sky-btn-primary:active, .sky-theme-modern .sky-btn-primary.sky-btn-active {
594
- border: none;
595
- box-shadow: inset 0 0 0 2px #c1e8fb;
596
- background-image: none;
890
+ background-color: var(--sky-color-background-action-primary-active);
891
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-primary-active);
597
892
  }
598
- .sky-theme-modern .sky-btn-primary.sky-btn-disabled, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-primary[disabled], .sky-theme-modern .sky-btn-primary[disabled]:hover, .sky-theme-modern .sky-btn-primary[disabled]:focus-visible, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-primary[disabled]:active, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active {
599
- border: none;
600
- box-shadow: inset 0 0 0 1px #d2d2d2;
601
- background-color: #ededee;
602
- color: #686c73;
603
- opacity: 1;
893
+ .sky-theme-modern .sky-btn-primary:focus-visible:not(:active) {
894
+ background-color: var(--sky-color-background-action-primary-focus);
895
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-primary-focus), var(--sky-elevation-focus);
604
896
  }
605
- .sky-theme-modern .sky-btn-primary:focus-visible {
606
- outline: none;
897
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-primary[disabled], .sky-theme-modern .sky-btn-primary[disabled]:hover, .sky-theme-modern .sky-btn-primary[disabled]:focus-visible, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-primary[disabled]:active, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active {
898
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled);
899
+ background-color: var(--sky-color-background-action-primary-disabled);
607
900
  }
608
- .sky-theme-modern .sky-btn-primary:focus-visible:not(:active) {
609
- border: none;
610
- box-shadow: inset 0 0 0 2px #c1e8fb, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
901
+ .sky-theme-modern .sky-btn-primary.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
902
+ box-shadow: var(--sky-override-button-primary-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled));
611
903
  }
612
904
  .sky-theme-modern .sky-btn-danger {
613
- border: none;
614
- box-shadow: inset 0 0 0 1px #d93a3d;
615
- background-color: #d93a3d;
616
- color: #ffffff;
617
- padding: 9px 21px;
905
+ background-color: var(--sky-color-background-action-danger-base);
906
+ color: var(--sky-color-text-inverse);
907
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-danger-base);
618
908
  }
619
909
  .sky-theme-modern .sky-btn-danger:hover {
620
- border: none;
621
- box-shadow: inset 0 0 0 1px #f7a08f;
622
- text-decoration: none;
623
- }
624
- .sky-theme-modern .sky-btn-danger:hover, .sky-theme-modern .sky-btn-danger:active, .sky-theme-modern .sky-btn-danger.sky-btn-active {
625
- color: #ffffff;
910
+ background-color: var(--sky-color-background-action-danger-hover);
911
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-danger-hover);
626
912
  }
627
913
  .sky-theme-modern .sky-btn-danger:active, .sky-theme-modern .sky-btn-danger.sky-btn-active {
628
- border: none;
629
- box-shadow: inset 0 0 0 2px #f7a08f;
630
- background-image: none;
631
- }
632
- .sky-theme-modern .sky-btn-danger.sky-btn-disabled, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-danger[disabled], .sky-theme-modern .sky-btn-danger[disabled]:hover, .sky-theme-modern .sky-btn-danger[disabled]:focus-visible, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-danger[disabled]:active, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active {
633
- border: none;
634
- box-shadow: inset 0 0 0 1px #d2d2d2;
635
- background-color: #ededee;
636
- color: #686c73;
637
- opacity: 1;
638
- }
639
- .sky-theme-modern .sky-btn-danger:focus-visible {
640
- outline: none;
914
+ background-color: var(--sky-color-background-action-danger-active);
915
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-danger-active);
641
916
  }
642
917
  .sky-theme-modern .sky-btn-danger:focus-visible:not(:active) {
643
- border: none;
644
- box-shadow: inset 0 0 0 2px #f7a08f, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
918
+ background-color: var(--sky-color-background-action-danger-focus);
919
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-danger-focus), var(--sky-elevation-focus);
645
920
  }
646
- .sky-theme-modern .sky-btn-link {
647
- border: none;
648
- box-shadow: inset 0 0 0 1px transparent;
649
- background-color: transparent;
650
- color: #1870B8;
651
- padding: 9px 21px;
921
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-danger[disabled], .sky-theme-modern .sky-btn-danger[disabled]:hover, .sky-theme-modern .sky-btn-danger[disabled]:focus-visible, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-danger[disabled]:active, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active {
922
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled);
923
+ background-color: var(--sky-color-background-action-danger-disabled);
652
924
  }
653
- .sky-theme-modern .sky-btn-link:hover {
654
- border: none;
655
- box-shadow: inset 0 0 0 1px #1870B8;
656
- text-decoration: none;
925
+ .sky-theme-modern .sky-btn-danger.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
926
+ box-shadow: var(--sky-override-button-danger-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled));
657
927
  }
658
- .sky-theme-modern .sky-btn-link:hover, .sky-theme-modern .sky-btn-link:active, .sky-theme-modern .sky-btn-link.sky-btn-active {
659
- color: #1870B8;
928
+ .sky-theme-modern .sky-btn-link {
929
+ color: var(--sky-color-text-action);
660
930
  }
661
- .sky-theme-modern .sky-btn-link:active, .sky-theme-modern .sky-btn-link.sky-btn-active {
662
- border: none;
663
- box-shadow: inset 0 0 0 2px #1870B8;
664
- background-image: none;
931
+ .sky-theme-modern .sky-btn-borderless,
932
+ .sky-theme-modern .sky-btn-icon-borderless {
933
+ color: var(--sky-color-icon-deemphasized);
665
934
  }
666
- .sky-theme-modern .sky-btn-link.sky-btn-disabled, .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link[disabled], .sky-theme-modern .sky-btn-link[disabled]:hover, .sky-theme-modern .sky-btn-link[disabled]:focus-visible, .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link[disabled]:active, .sky-theme-modern .sky-btn-link[disabled].sky-btn-active {
667
- border: none;
668
- box-shadow: inset 0 0 0 1px #d2d2d2;
669
- background-color: #ededee;
670
- color: #686c73;
671
- opacity: 1;
935
+ .sky-theme-modern .sky-btn-icon-borderless {
936
+ padding: var(--sky-override-button-icon-borderless-padding, var(--sky-space-inset-balanced-xs));
937
+ height: var(--sky-override-borderless-icon-size, "");
938
+ width: var(--sky-override-borderless-icon-size, "");
672
939
  }
673
- .sky-theme-modern .sky-btn-link:focus-visible {
674
- outline: none;
940
+ .sky-theme-modern .sky-btn-link,
941
+ .sky-theme-modern .sky-btn-borderless,
942
+ .sky-theme-modern .sky-btn-icon-borderless {
943
+ background-color: var(--sky-color-background-action-tertiary-base);
944
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-base);
675
945
  }
676
- .sky-theme-modern .sky-btn-link:focus-visible:not(:active) {
677
- border: none;
678
- box-shadow: inset 0 0 0 2px #1870B8, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
946
+ .sky-theme-modern .sky-btn-link:hover,
947
+ .sky-theme-modern .sky-btn-borderless:hover,
948
+ .sky-theme-modern .sky-btn-icon-borderless:hover {
949
+ background-color: var(--sky-color-background-action-tertiary-hover);
950
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover);
951
+ }
952
+ .sky-theme-modern .sky-btn-link:active, .sky-theme-modern .sky-btn-link.sky-btn-active,
953
+ .sky-theme-modern .sky-btn-borderless:active,
954
+ .sky-theme-modern .sky-btn-borderless.sky-btn-active,
955
+ .sky-theme-modern .sky-btn-icon-borderless:active,
956
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-active {
957
+ background-color: var(--sky-color-background-action-tertiary-active);
958
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active);
959
+ }
960
+ .sky-theme-modern .sky-btn-link:focus-visible:not(:active),
961
+ .sky-theme-modern .sky-btn-borderless:focus-visible:not(:active),
962
+ .sky-theme-modern .sky-btn-icon-borderless:focus-visible:not(:active) {
963
+ background-color: var(--sky-color-background-action-tertiary-focus);
964
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus);
965
+ }
966
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled, .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link[disabled], .sky-theme-modern .sky-btn-link[disabled]:hover, .sky-theme-modern .sky-btn-link[disabled]:focus-visible, .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link[disabled]:active, .sky-theme-modern .sky-btn-link[disabled].sky-btn-active,
967
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled,
968
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:hover,
969
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:focus-visible,
970
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-focus,
971
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:active,
972
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-active,
973
+ .sky-theme-modern .sky-btn-borderless[disabled],
974
+ .sky-theme-modern .sky-btn-borderless[disabled]:hover,
975
+ .sky-theme-modern .sky-btn-borderless[disabled]:focus-visible,
976
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-focus,
977
+ .sky-theme-modern .sky-btn-borderless[disabled]:active,
978
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-active,
979
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled,
980
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:hover,
981
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:focus-visible,
982
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus,
983
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:active,
984
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active,
985
+ .sky-theme-modern .sky-btn-icon-borderless[disabled],
986
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:hover,
987
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:focus-visible,
988
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus,
989
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:active,
990
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active {
991
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled);
992
+ background-color: var(--sky-color-background-action-tertiary-disabled);
993
+ }
994
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus),
995
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:is(:focus-visible, .sky-btn-focus),
996
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus),
997
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus),
998
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus),
999
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus),
1000
+ .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus),
1001
+ .sky-theme-modern .sky-btn-borderless[disabled]:is(:focus-visible, .sky-btn-focus),
1002
+ .sky-theme-modern .sky-btn-borderless[disabled]:hover:is(:focus-visible, .sky-btn-focus),
1003
+ .sky-theme-modern .sky-btn-borderless[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus),
1004
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
1005
+ .sky-theme-modern .sky-btn-borderless[disabled]:active:is(:focus-visible, .sky-btn-focus),
1006
+ .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus),
1007
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:is(:focus-visible, .sky-btn-focus),
1008
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus),
1009
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus),
1010
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus),
1011
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus),
1012
+ .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus),
1013
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:is(:focus-visible, .sky-btn-focus),
1014
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:hover:is(:focus-visible, .sky-btn-focus),
1015
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus),
1016
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
1017
+ .sky-theme-modern .sky-btn-icon-borderless[disabled]:active:is(:focus-visible, .sky-btn-focus),
1018
+ .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
1019
+ box-shadow: var(--sky-override-button-tertiary-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled));
679
1020
  }
680
1021
  .sky-theme-modern .sky-btn-link-inline {
681
- border-radius: 0;
682
- color: var(--sky-text-color-action-primary);
1022
+ background-color: var(--sky-color-background-action-tertiary-base);
1023
+ border-radius: var(--sky-override-button-link-inline-border-radius, var(--sky-border-radius-s));
1024
+ padding: var(--sky-space-inset-balanced-none);
1025
+ color: var(--sky-color-text-action);
1026
+ font-size: var(--sky-override-button-link-inline-font-size, inherit);
1027
+ vertical-align: var(--sky-override-button-link-inline-vertical-align, "");
683
1028
  }
684
1029
  .sky-theme-modern .sky-btn-link-inline:focus-visible:not(:active) {
685
- box-shadow: 0 0 0 2px var(--sky-background-color-primary-dark), 0 1px 8px 2px rgba(0, 0, 0, 0.3);
1030
+ background-color: var(--sky-color-background-action-tertiary-focus);
1031
+ box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus);
686
1032
  }
687
- .sky-theme-modern .sky-btn-link-inline:hover, .sky-theme-modern .sky-btn-link-inline:active {
688
- color: var(--sky-text-color-action-primary-hover);
689
- text-decoration: underline;
1033
+ .sky-theme-modern .sky-btn-link-inline:active {
1034
+ background-color: var(--sky-color-background-action-tertiary-active);
690
1035
  }
691
- .sky-theme-modern .sky-btn-borderless {
692
- border: none;
693
- box-shadow: inset 0 0 0 1px transparent;
694
- background-color: transparent;
695
- color: #686c73;
696
- padding: 9px 21px;
697
- }
698
- .sky-theme-modern .sky-btn-borderless:hover {
699
- border: none;
700
- box-shadow: inset 0 0 0 1px #1870B8;
701
- text-decoration: none;
1036
+ .sky-theme-modern .sky-btn-link-inline:hover {
1037
+ background-color: var(--sky-color-background-action-tertiary-hover);
702
1038
  }
703
- .sky-theme-modern .sky-btn-borderless:hover, .sky-theme-modern .sky-btn-borderless:active, .sky-theme-modern .sky-btn-borderless.sky-btn-active {
704
- color: #686c73;
705
- }
706
- .sky-theme-modern .sky-btn-borderless:active, .sky-theme-modern .sky-btn-borderless.sky-btn-active {
707
- border: none;
708
- box-shadow: inset 0 0 0 2px #1870B8;
709
- background-image: none;
710
- }
711
- .sky-theme-modern .sky-btn-borderless.sky-btn-disabled, .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-borderless.sky-btn-disabled:active, .sky-theme-modern .sky-btn-borderless.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-borderless[disabled], .sky-theme-modern .sky-btn-borderless[disabled]:hover, .sky-theme-modern .sky-btn-borderless[disabled]:focus-visible, .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-borderless[disabled]:active, .sky-theme-modern .sky-btn-borderless[disabled].sky-btn-active {
712
- border: none;
713
- box-shadow: inset 0 0 0 1px #d2d2d2;
714
- background-color: #ededee;
715
- color: #686c73;
716
- opacity: 1;
1039
+ .sky-theme-modern .sky-btn-link-inline:hover, .sky-theme-modern .sky-btn-link-inline:active {
1040
+ color: var(--sky-override-button-link-inline-color-hover-active, var(--sky-color-text-action));
1041
+ text-decoration: underline;
717
1042
  }
718
- .sky-theme-modern .sky-btn-borderless:focus-visible {
719
- outline: none;
1043
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link-inline[disabled], .sky-theme-modern .sky-btn-link-inline[disabled]:hover, .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link-inline[disabled]:active, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active {
1044
+ box-shadow: inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled);
720
1045
  }
721
- .sky-theme-modern .sky-btn-borderless:focus-visible:not(:active) {
722
- border: none;
723
- box-shadow: inset 0 0 0 2px #1870B8, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
1046
+ .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
1047
+ box-shadow: var(--sky-override-button-link-inline-disabled-box-shadow, inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled));
724
1048
  }
725
1049
  .sky-theme-modern .sky-btn-borderless-inline {
726
- color: var(--sky-text-color-deemphasized);
727
- }
728
- .sky-theme-modern .sky-btn-icon {
729
- border: none;
730
- box-shadow: inset 0 0 0 1px #d2d2d2;
731
- background-color: #ffffff;
732
- color: #212327;
733
- padding: 9px 15px;
734
- }
735
- .sky-theme-modern .sky-btn-icon:hover {
736
- border: none;
737
- box-shadow: inset 0 0 0 1px #1870B8;
738
- text-decoration: none;
739
- }
740
- .sky-theme-modern .sky-btn-icon:hover, .sky-theme-modern .sky-btn-icon:active, .sky-theme-modern .sky-btn-icon.sky-btn-active {
741
- color: #212327;
742
- }
743
- .sky-theme-modern .sky-btn-icon:active, .sky-theme-modern .sky-btn-icon.sky-btn-active {
744
- border: none;
745
- box-shadow: inset 0 0 0 2px #1870B8;
746
- background-image: none;
747
- }
748
- .sky-theme-modern .sky-btn-icon.sky-btn-disabled, .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-icon.sky-btn-disabled:active, .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-icon[disabled], .sky-theme-modern .sky-btn-icon[disabled]:hover, .sky-theme-modern .sky-btn-icon[disabled]:focus-visible, .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-icon[disabled]:active, .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active {
749
- border: none;
750
- box-shadow: inset 0 0 0 1px #d2d2d2;
751
- background-color: #ededee;
752
- color: #686c73;
753
- opacity: 1;
754
- }
755
- .sky-theme-modern .sky-btn-icon:focus-visible {
756
- outline: none;
757
- }
758
- .sky-theme-modern .sky-btn-icon:focus-visible:not(:active) {
759
- border: none;
760
- box-shadow: inset 0 0 0 2px #1870B8, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
761
- }
762
- .sky-theme-modern .sky-btn-icon-borderless {
763
- border: none;
764
- box-shadow: inset 0 0 0 1px transparent;
765
- background-color: transparent;
766
- color: #686c73;
767
- padding: 1px;
768
- height: 26px;
769
- width: 26px;
770
- }
771
- .sky-theme-modern .sky-btn-icon-borderless:hover {
772
- border: none;
773
- box-shadow: inset 0 0 0 1px #1870B8;
774
- text-decoration: none;
775
- }
776
- .sky-theme-modern .sky-btn-icon-borderless:hover, .sky-theme-modern .sky-btn-icon-borderless:active, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-active {
777
- color: #686c73;
778
- }
779
- .sky-theme-modern .sky-btn-icon-borderless:active, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-active {
780
- border: none;
781
- box-shadow: inset 0 0 0 2px #1870B8;
782
- background-image: none;
1050
+ color: var(--sky-color-text-deemphasized);
1051
+ padding: var(--sky-space-inset-balanced-none);
1052
+ font-size: var(--sky-override-button-link-inline-font-size, inherit);
1053
+ vertical-align: var(--sky-override-button-link-inline-vertical-align, "");
783
1054
  }
784
- .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled:active, .sky-theme-modern .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-icon-borderless[disabled], .sky-theme-modern .sky-btn-icon-borderless[disabled]:hover, .sky-theme-modern .sky-btn-icon-borderless[disabled]:focus-visible, .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-icon-borderless[disabled]:active, .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active {
785
- border: none;
786
- box-shadow: inset 0 0 0 1px #d2d2d2;
787
- background-color: #ededee;
788
- color: #686c73;
789
- opacity: 1;
1055
+ .sky-theme-modern .sky-btn-borderless-inline:focus-visible:not(:active) {
1056
+ box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus);
790
1057
  }
791
- .sky-theme-modern .sky-btn-icon-borderless:focus-visible {
792
- outline: none;
1058
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled, .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:active, .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-borderless-inline[disabled], .sky-theme-modern .sky-btn-borderless-inline[disabled]:hover, .sky-theme-modern .sky-btn-borderless-inline[disabled]:focus-visible, .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-borderless-inline[disabled]:active, .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-active {
1059
+ box-shadow: inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled);
793
1060
  }
794
- .sky-theme-modern .sky-btn-icon-borderless:focus-visible:not(:active) {
795
- border: none;
796
- box-shadow: inset 0 0 0 2px #1870B8, 0px 1px 8px 0px rgba(0, 0, 0, 0.3);
1061
+ .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-borderless-inline[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
1062
+ box-shadow: var(--sky-override-button-borderless-inline-disabled-box-shadow, inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled));
797
1063
  }
798
1064
  .sky-theme-modern .sky-btn-sm {
799
1065
  padding: 5px 10px;
@@ -884,113 +1150,6 @@
884
1150
  padding-bottom: 10px;
885
1151
  padding-left: 13px;
886
1152
  }
887
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default {
888
- color: #fbfcfe;
889
- background-color: transparent;
890
- border-color: #686c73;
891
- }
892
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-active {
893
- color: #fbfcfe;
894
- background-color: rgba(0, 0, 0, 0);
895
- border-color: #505358;
896
- }
897
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-active {
898
- background-image: none;
899
- }
900
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled], .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled].sky-btn-active, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:hover, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:focus, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-focus, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default:active, fieldset[disabled] .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-active {
901
- background-color: transparent;
902
- border-color: #686c73;
903
- }
904
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled:focus-visible, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled.sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger.sky-btn-disabled.sky-btn-active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled], .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled]:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled]:focus-visible, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled].sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled]:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-danger[disabled].sky-btn-active,
905
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled,
906
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:hover,
907
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:focus-visible,
908
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled.sky-btn-focus,
909
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled:active,
910
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default.sky-btn-disabled.sky-btn-active,
911
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled],
912
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:hover,
913
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:focus-visible,
914
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled].sky-btn-focus,
915
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled]:active,
916
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-default[disabled].sky-btn-active,
917
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled,
918
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled:hover,
919
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled:focus-visible,
920
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled.sky-btn-focus,
921
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled:active,
922
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary.sky-btn-disabled.sky-btn-active,
923
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled],
924
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled]:hover,
925
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled]:focus-visible,
926
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled].sky-btn-focus,
927
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled]:active,
928
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-primary[disabled].sky-btn-active {
929
- border: none;
930
- box-shadow: inset 0 0 0 1px #686c73;
931
- background-color: transparent;
932
- color: #686c73;
933
- opacity: 1;
934
- }
935
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled:focus-visible, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled.sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless.sky-btn-disabled.sky-btn-active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled], .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled]:hover, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled]:focus-visible, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled].sky-btn-focus, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled]:active, .sky-theme-modern.sky-theme-mode-dark .sky-btn-borderless[disabled].sky-btn-active,
936
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled,
937
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled:hover,
938
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled:focus-visible,
939
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-focus,
940
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled:active,
941
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless.sky-btn-disabled.sky-btn-active,
942
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled],
943
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled]:hover,
944
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled]:focus-visible,
945
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled].sky-btn-focus,
946
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled]:active,
947
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-icon-borderless[disabled].sky-btn-active,
948
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled,
949
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled:hover,
950
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled:focus-visible,
951
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled.sky-btn-focus,
952
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled:active,
953
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link.sky-btn-disabled.sky-btn-active,
954
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled],
955
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled]:hover,
956
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled]:focus-visible,
957
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled].sky-btn-focus,
958
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled]:active,
959
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-link[disabled].sky-btn-active {
960
- border: none;
961
- box-shadow: inset 0 0 0 1px transparent;
962
- background-color: transparent;
963
- color: #686c73;
964
- opacity: 1;
965
- }
966
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab {
967
- color: #eeeeef;
968
- }
969
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-close,
970
- .sky-theme-modern.sky-theme-mode-dark .sky-tab-header-count {
971
- color: #efefef;
972
- }
973
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-selected {
974
- color: #fff;
975
- }
976
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-selected:hover {
977
- color: #fff;
978
- }
979
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-selected .sky-btn-tab-close,
980
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-selected .sky-tab-header-count {
981
- color: #efefef;
982
- }
983
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab:hover:not(.sky-btn-tab-disabled),
984
- .sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-selected {
985
- color: #fff;
986
- }
987
- .sky-theme-modern.sky-theme-mode-dark .sky-tab-dropdown-menu-item .sky-btn-tab {
988
- background-color: #252a2e;
989
- }
990
- .sky-theme-modern.sky-theme-mode-dark .sky-tab-dropdown-menu-item .sky-btn-tab.sky-btn-tab-selected {
991
- background-color: #252a2e;
992
- color: #fff;
993
- }
994
1153
 
995
1154
  .sky-theme-modern .sky-elevation-0-bordered {
996
1155
  border: 1px solid #d2d2d2;
@@ -1203,6 +1362,10 @@
1203
1362
  --sky-override-font-size: var(--sky-font-size-body-m);
1204
1363
  --sky-override-form-font-weight: var(--sky-font-weight-body-m);
1205
1364
  --sky-override-p-line-height: var(--sky-font-line_height-body-m);
1365
+ --sky-override-a-border-radius: 0;
1366
+ --sky-override-a-color-hover-active: var(
1367
+ --sky-text-color-action-primary-hover
1368
+ );
1206
1369
  }
1207
1370
 
1208
1371
  html:has(.sky-theme-brand-blackbaud) {
@@ -1224,10 +1387,18 @@ html:has(.sky-theme-brand-blackbaud) {
1224
1387
  }
1225
1388
 
1226
1389
  .sky-theme-modern a {
1227
- border-radius: 0;
1390
+ color: var(--sky-color-text-action);
1391
+ border-radius: var(--sky-override-a-border-radius, var(--sky-border-radius-s));
1392
+ }
1393
+ .sky-theme-modern a:hover:not(.sky-btn-primary):not(.sky-btn-danger), .sky-theme-modern a:active:not(.sky-btn-primary):not(.sky-btn-danger) {
1394
+ color: var(--sky-override-a-color-hover-active, var(--sky-color-text-action));
1395
+ }
1396
+ .sky-theme-modern a:hover.sky-btn-primary, .sky-theme-modern a:hover.sky-btn-danger, .sky-theme-modern a:active.sky-btn-primary, .sky-theme-modern a:active.sky-btn-danger {
1397
+ color: var(--sky-color-text-inverse);
1228
1398
  }
1229
1399
  .sky-theme-modern a:focus-visible:not(:active) {
1230
- box-shadow: 0 0 0 2px var(--sky-background-color-primary-dark), 0 1px 8px 2px rgba(0, 0, 0, 0.3);
1400
+ outline: none;
1401
+ box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus);
1231
1402
  }
1232
1403
  .sky-theme-modern h1,
1233
1404
  .sky-theme-modern .sky-font-heading-1 {
@@ -1337,6 +1508,23 @@ html:has(.sky-theme-brand-blackbaud) {
1337
1508
  font-size: inherit;
1338
1509
  font-weight: var(--sky-font-weight-emphasized);
1339
1510
  }
1511
+ .sky-theme-modern .sky-font-hint-text-s {
1512
+ color: var(--sky-color-text-deemphasized);
1513
+ font-family: var(--sky-font-family-primary);
1514
+ font-size: var(--sky-font-size-hint-s);
1515
+ font-style: var(--sky-font-style-hint-s-style);
1516
+ font-weight: var(--sky-font-weight-hint-s);
1517
+ letter-spacing: var(--sky-font-letter_spacing-hint-s);
1518
+ line-height: var(--sky-font-line_height-hint-s);
1519
+ }
1520
+ .sky-theme-modern .sky-font-hint-text-m {
1521
+ color: var(--sky-color-text-deemphasized);
1522
+ font-family: var(--sky-font-family-primary);
1523
+ font-size: var(--sky-font-size-hint-m);
1524
+ font-style: var(--sky-font-style-hint-m-style);
1525
+ font-weight: var(--sky-font-weight-hint-m);
1526
+ line-height: var(--sky-font-line_height-hint-m);
1527
+ }
1340
1528
  .sky-theme-modern .sky-font-display-1 {
1341
1529
  color: var(--sky-color-text-default);
1342
1530
  font-family: var(--sky-font-family-primary);
@@ -1464,6 +1652,14 @@ html:has(.sky-theme-brand-blackbaud) {
1464
1652
  margin-top: 0;
1465
1653
  margin-bottom: 60px;
1466
1654
  }
1655
+ .sky-theme-modern .sky-form-field-stacked {
1656
+ margin-top: 0;
1657
+ margin-bottom: var(--sky-space-gap-form-l);
1658
+ }
1659
+ .sky-theme-modern .sky-field-group-stacked {
1660
+ margin-top: 0;
1661
+ margin-bottom: var(--sky-space-gap-form-xl);
1662
+ }
1467
1663
 
1468
1664
  .sky-theme-modern.sky-theme-mode-dark .sky-border-bottom-dark {
1469
1665
  border-bottom-color: #686c73;