@openeuropa/bcl-theme-joinup 0.4020.202509111730 → 0.4068.202510062345

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.
@@ -8192,6 +8192,14 @@ svg {
8192
8192
  border-color: #dadee0;
8193
8193
  }
8194
8194
 
8195
+ .border-top-subtle {
8196
+ border-top: 1px solid tint-color(#253ebe, 80%);
8197
+ }
8198
+
8199
+ .border-bottom-subtle {
8200
+ border-bottom: 1px solid tint-color(#253ebe, 80%);
8201
+ }
8202
+
8195
8203
  .grid-3-9 {
8196
8204
  -ms-grid-columns: 25% 75%;
8197
8205
  grid-template-columns: 25% 75%;
@@ -10848,7 +10856,7 @@ svg {
10848
10856
  border-radius: var(--bs-border-radius-sm) !important;
10849
10857
  }
10850
10858
 
10851
- .rounded-2 {
10859
+ .rounded-2, .bcl-navbar-toggler {
10852
10860
  border-radius: var(--bs-border-radius) !important;
10853
10861
  }
10854
10862
 
@@ -17394,74 +17402,40 @@ em.placeholder {
17394
17402
  display: inline;
17395
17403
  }
17396
17404
 
17397
- .bcl-header .container {
17398
- position: relative;
17399
- }
17400
-
17401
- .bcl-header__project,
17402
- .bcl-header__navbar {
17403
- background: linear-gradient(90deg, #039 0%, #1b4ac3 100%);
17404
- }
17405
-
17406
- .bcl-header__top-navbar .navbar-collapse {
17407
- -ms-flex-pack: end;
17408
- justify-content: end;
17409
- }
17410
- .bcl-header__top-navbar .navbar-toggler {
17411
- border: none;
17412
- color: #f8f9fa;
17413
- }
17414
- .bcl-header__top-navbar .navbar-toggler-icon {
17415
- background: url("data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2Ij48cmVjdCB3aWR0aD0iMjU2IiBoZWlnaHQ9IjI1NiIgZmlsbD0ibm9uZSIvPjxjaXJjbGUgY3g9IjEyOCIgY3k9IjY0IiByPSIxNiIvPjxjaXJjbGUgY3g9IjEyOCIgY3k9IjEyOCIgcj0iMTYiLz48Y2lyY2xlIGN4PSIxMjgiIGN5PSIxOTIiIHI9IjE2Ii8+PC9zdmc+");
17416
- }
17417
-
17418
17405
  .bcl-header .nav-link {
17419
17406
  color: #1b4ac3;
17420
17407
  display: -ms-flexbox;
17421
17408
  display: flex;
17422
17409
  -ms-flex-align: center;
17423
17410
  align-items: center;
17424
- padding: 0.5rem;
17425
17411
  }
17426
17412
 
17427
- .bcl-header__navbar .navbar-collapse {
17428
- padding-bottom: 1rem;
17413
+ .bcl-navbar-toggler {
17414
+ background: transparent;
17415
+ border: none;
17416
+ border-radius: var(--bs-border-radius-sm);
17417
+ padding: 0.375rem 0.75rem;
17418
+ color: #1073de;
17419
+ line-height: 1;
17429
17420
  }
17430
- .bcl-header__navbar .navbar-nav .nav-link {
17431
- color: #fafbfc;
17421
+ .bcl-navbar-toggler .active-icon {
17422
+ display: none;
17432
17423
  }
17433
- .bcl-header__navbar .navbar-nav .nav-link:focus, .bcl-header__navbar .navbar-nav .nav-link:hover, .bcl-header__navbar .navbar-nav .nav-link.active {
17424
+ .bcl-navbar-toggler[aria-expanded=true] {
17425
+ background-color: #143b76;
17434
17426
  color: #fff;
17435
17427
  }
17436
- .bcl-header__navbar .navbar-nav .nav-link:focus-visible {
17437
- outline: 2px solid #fff;
17438
- border-radius: 4px;
17439
- outline-offset: 0;
17440
- }
17441
- .bcl-header__navbar .navbar-toggler {
17442
- position: absolute;
17443
- top: -43px;
17444
- left: 0.75rem;
17445
- border-color: #fff;
17446
- }
17447
- .bcl-header__navbar .navbar-toggler-icon {
17448
- background: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
17428
+ .bcl-navbar-toggler[aria-expanded=true] .active-icon {
17429
+ display: block;
17449
17430
  }
17450
- .bcl-header__navbar input:active,
17451
- .bcl-header__navbar input:focus {
17452
- box-shadow: 0 0 0 0.25rem hsla(210, 2%, 83%, 0.5);
17431
+ .bcl-navbar-toggler[aria-expanded=true] .default-icon {
17432
+ display: none;
17453
17433
  }
17454
17434
 
17455
17435
  .bcl-header--ec,
17456
17436
  .ec__header {
17457
17437
  /* stylelint-disable-next-line no-descending-specificity */
17458
17438
  }
17459
- .bcl-header--ec .bcl-header__project,
17460
- .bcl-header--ec .bcl-header__navbar,
17461
- .ec__header .bcl-header__project,
17462
- .ec__header .bcl-header__navbar {
17463
- background: #004494;
17464
- }
17465
17439
  .bcl-header--ec .nav-link,
17466
17440
  .ec__header .nav-link {
17467
17441
  color: #17458f;
@@ -17472,18 +17446,6 @@ em.placeholder {
17472
17446
  align-items: flex-end;
17473
17447
  }
17474
17448
 
17475
- .bcl-header--neutral .bcl-header__project,
17476
- .bcl-header--neutral .bcl-header__navbar {
17477
- background: #555859;
17478
- }
17479
-
17480
- .bcl-header:not(.bcl-header--neutral) .bcl-header__project {
17481
- padding-top: 1rem;
17482
- }
17483
-
17484
- .bcl-header .navbar-brand img {
17485
- width: 100px;
17486
- }
17487
17449
  .bcl-header .notification {
17488
17450
  position: relative;
17489
17451
  padding-right: 0;
@@ -17499,26 +17461,19 @@ em.placeholder {
17499
17461
  transform: translate(-11px, 5px);
17500
17462
  }
17501
17463
 
17502
- .bcl-header__project .bcl-header__site-name {
17503
- display: inline-block;
17504
- margin-bottom: 0;
17505
- font-size: 1.3rem;
17506
- font-weight: 300;
17507
- color: #fff;
17508
- vertical-align: middle;
17509
- max-width: 80%;
17464
+ .bcl-header__navbar.navbar {
17465
+ padding: 0;
17510
17466
  }
17511
-
17512
- @media only screen and (max-width: 400px) {
17513
- .bcl-header--neutral .bcl-header__project-logo {
17514
- display: none;
17515
- }
17467
+ .bcl-header__navbar.navbar .dropdown-toggle,
17468
+ .bcl-header__navbar.navbar .nav-link {
17469
+ padding: 0.75rem 1rem;
17470
+ border: none;
17471
+ background: transparent;
17516
17472
  }
17517
- @media (max-width: 575.98px) {
17518
- .bcl-header .navbar:first-child .nav-link {
17519
- padding: 0.5rem 0.4rem;
17520
- }
17473
+ .bcl-header__navbar.navbar.collapsing {
17474
+ transition: none;
17521
17475
  }
17476
+
17522
17477
  @media (min-width: 768px) {
17523
17478
  .bcl-header--ec .navbar-brand img,
17524
17479
  .ec__header .navbar-brand img {
@@ -17526,32 +17481,31 @@ em.placeholder {
17526
17481
  }
17527
17482
  }
17528
17483
  @media (max-width: 991.98px) {
17529
- .bcl-header__site-name {
17530
- margin-left: 5rem;
17531
- }
17532
- .bcl-header__top-navbar .navbar-collapse {
17533
- z-index: 1050;
17534
- position: absolute;
17535
- right: 0.75rem;
17536
- top: 100%;
17537
- background: white;
17538
- border: 1px solid #dadee0;
17539
- border-radius: 4px;
17540
- }
17541
- .bcl-header__top-navbar .navbar-collapse .nav {
17542
- -ms-flex-align: start;
17543
- align-items: flex-start;
17544
- -ms-flex-direction: column;
17545
- flex-direction: column;
17546
- min-width: 16rem;
17547
- padding: 1rem;
17484
+ body:has(.bcl-header__navbar #main-navbar.collapsing),
17485
+ body:has(.bcl-header__navbar #main-navbar.show),
17486
+ body:has(.bcl-header__navbar.collapsing),
17487
+ body:has(.bcl-header__navbar.show) {
17488
+ overflow: hidden;
17548
17489
  }
17549
- .bcl-header__top-navbar .navbar-collapse .nav li {
17550
- width: 100%;
17490
+ header:has(.bcl-header__navbar #main-navbar.collapsing),
17491
+ header:has(.bcl-header__navbar #main-navbar.show),
17492
+ header:has(.bcl-header__navbar.collapsing),
17493
+ header:has(.bcl-header__navbar.show) {
17494
+ height: 100vh;
17495
+ display: -ms-flexbox;
17496
+ display: flex;
17497
+ -ms-flex-flow: column;
17498
+ flex-flow: column;
17499
+ overflow: auto;
17500
+ }
17501
+ header:has(.bcl-header__navbar #main-navbar.collapsing) > div:has(.breadcrumb),
17502
+ header:has(.bcl-header__navbar #main-navbar.show) > div:has(.breadcrumb),
17503
+ header:has(.bcl-header__navbar.collapsing) > div:has(.breadcrumb),
17504
+ header:has(.bcl-header__navbar.show) > div:has(.breadcrumb) {
17505
+ display: none;
17551
17506
  }
17552
- .bcl-header__project {
17553
- min-height: 3rem;
17554
- padding-top: 1rem;
17507
+ .bcl-header {
17508
+ box-shadow: var(--bs-box-shadow);
17555
17509
  }
17556
17510
  .bcl-header nav + nav {
17557
17511
  min-height: 3.5rem;
@@ -17559,53 +17513,165 @@ em.placeholder {
17559
17513
  .bcl-header nav + nav .navbar-toggler {
17560
17514
  position: static;
17561
17515
  }
17562
- .bcl-header__navbar .navbar-collapse {
17563
- max-width: 100%;
17516
+ .bcl-header__top-navbar {
17517
+ z-index: 1040;
17564
17518
  }
17565
- .bcl-header__navbar .navbar-collapse .nav-item.dropdown {
17566
- max-width: 100%;
17519
+ .bcl-header__navbar.navbar {
17520
+ background: #fff;
17521
+ padding-top: 0;
17522
+ z-index: 1030;
17523
+ width: 100%;
17524
+ -ms-flex-align: start;
17525
+ align-items: flex-start;
17526
+ }
17527
+ .bcl-header__navbar.navbar .navbar-nav {
17528
+ width: 100%;
17529
+ margin-top: 1rem;
17530
+ }
17531
+ .bcl-header__navbar.navbar .navbar-nav:has(.bcl-mega-menu__container.show) .nav-item {
17532
+ display: none;
17567
17533
  }
17568
- .bcl-header__navbar .navbar-collapse .nav-item.dropdown a {
17534
+ .bcl-header__navbar.navbar .navbar-nav:has(.bcl-mega-menu__container.show) .nav-item:has(.bcl-mega-menu__container.show) {
17535
+ display: block;
17536
+ }
17537
+ .bcl-header__navbar.navbar .navbar-nav .dropdown-toggle,
17538
+ .bcl-header__navbar.navbar .navbar-nav .nav-link {
17539
+ color: #212529;
17540
+ width: 100%;
17541
+ display: -ms-flexbox;
17542
+ display: flex;
17543
+ gap: 1rem;
17544
+ -ms-flex-pack: justify;
17545
+ justify-content: space-between;
17546
+ position: relative;
17547
+ padding: 1rem;
17548
+ border-bottom: 1px solid tint-color(#253ebe, 90%);
17549
+ text-align: left;
17550
+ border-radius: 0;
17569
17551
  white-space: normal;
17570
17552
  }
17571
- .bcl-header__navbar .navbar-collapse .nav-item.dropdown .dropdown-menu {
17572
- max-width: 100%;
17553
+ .bcl-header__navbar.navbar .navbar-nav .dropdown-toggle.active,
17554
+ .bcl-header__navbar.navbar .navbar-nav .nav-link.active {
17555
+ color: #212529;
17556
+ }
17557
+ .bcl-header__navbar.navbar .navbar-nav .dropdown-toggle:focus-visible,
17558
+ .bcl-header__navbar.navbar .navbar-nav .nav-link:focus-visible {
17559
+ outline: 2px solid #143b76;
17560
+ outline-offset: -2px;
17561
+ box-shadow: none;
17562
+ }
17563
+ .bcl-header__navbar.navbar .navbar-nav .dropdown-toggle::after,
17564
+ .bcl-header__navbar.navbar .navbar-nav .nav-link::after {
17565
+ -ms-flex-negative: 0;
17566
+ flex-shrink: 0;
17567
+ }
17568
+ .bcl-header__navbar.navbar .navbar-nav .bcl-mega-menu > .dropdown-toggle:after {
17569
+ background: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2215%22%20viewBox%3D%220%200%2016%2015%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M7.57488%2013.25L8.46238%2014.125L15.1374%207.45L8.43738%200.75L7.56238%201.625L12.7276%206.81247H0.5V8.06247H12.7512L7.57488%2013.25Z%22%20fill%3D%22%23212529%22%2F%3E%3C%2Fsvg%3E");
17570
+ -ms-flex-item-align: center;
17571
+ -ms-grid-row-align: center;
17572
+ align-self: center;
17573
+ content: "";
17574
+ border: none;
17575
+ width: 20px;
17576
+ height: 20px;
17577
+ background-size: cover;
17578
+ background-position: center;
17579
+ }
17580
+ .bcl-header__navbar.navbar .navbar-nav .dropdown-item {
17581
+ white-space: normal;
17573
17582
  }
17574
17583
  }
17575
17584
  @media (min-width: 992px) {
17576
- .bcl-header__project.light,
17577
- .bcl-header--ec .bcl-header__project.light,
17578
- .ec__header .bcl-header__project.light {
17579
- background: #fff;
17585
+ .bcl-header__navbar {
17586
+ background: linear-gradient(90deg, #039 0%, #1b4ac3 100%);
17587
+ }
17588
+ .bcl-header__navbar .dropdown-toggle,
17589
+ .bcl-header__navbar .nav-link {
17590
+ color: #fff;
17580
17591
  }
17581
- .bcl-header__site-name {
17582
- margin-left: 1.5rem;
17583
- font-weight: 500;
17592
+ .bcl-header--ec .bcl-header__navbar,
17593
+ .ec__header .bcl-header__navbar {
17594
+ background: #004494;
17584
17595
  }
17585
- .bcl-header__project.light .bcl-header__site-name {
17586
- color: #000;
17596
+ .bcl-header--neutral .bcl-header__navbar {
17597
+ background: #555859;
17587
17598
  }
17588
17599
  .bcl-header .navbar-toggler {
17589
17600
  position: relative;
17590
17601
  right: 0;
17591
17602
  bottom: 0;
17592
17603
  }
17593
- .bcl-header .navbar-brand img {
17594
- width: auto;
17604
+ .bcl-header__navbar .bcl-mega-menu {
17605
+ --bcl-mega-menu-zindex: 1050;
17595
17606
  }
17596
- .bcl-header__navbar .navbar-collapse {
17597
- padding-bottom: 0;
17598
- }
17599
- .bcl-header__navbar .dropdown-menu {
17600
- z-index: 1050;
17601
- }
17602
- .bcl-header:not(.bcl-header--neutral) .bcl-header__project {
17603
- padding-bottom: 1rem;
17607
+ .bcl-header__navbar.collapse {
17608
+ display: block;
17604
17609
  }
17605
17610
  .bcl-header--ec .navbar-brand img,
17606
17611
  .ec__header .navbar-brand img {
17607
17612
  width: 285px;
17608
17613
  }
17614
+ .bcl-header__navbar.navbar .dropdown-toggle,
17615
+ .bcl-header__navbar.navbar .nav-link {
17616
+ border-radius: 0;
17617
+ }
17618
+ .bcl-header__navbar.navbar .dropdown-toggle:hover,
17619
+ .bcl-header__navbar.navbar .nav-link:hover {
17620
+ background: tint-color(#253ebe, 90%);
17621
+ color: #212529;
17622
+ }
17623
+ .bcl-header__navbar.navbar .dropdown-toggle:hover:focus-visible,
17624
+ .bcl-header__navbar.navbar .nav-link:hover:focus-visible {
17625
+ outline-color: #143b76;
17626
+ }
17627
+ .bcl-header__navbar.navbar .dropdown-toggle.active, .bcl-header__navbar.navbar .dropdown-toggle.show,
17628
+ .bcl-header__navbar.navbar .nav-link.active,
17629
+ .bcl-header__navbar.navbar .nav-link.show {
17630
+ background: #fff;
17631
+ color: #212529;
17632
+ }
17633
+ .bcl-header__navbar.navbar .dropdown-toggle.active:focus-visible, .bcl-header__navbar.navbar .dropdown-toggle.show:focus-visible,
17634
+ .bcl-header__navbar.navbar .nav-link.active:focus-visible,
17635
+ .bcl-header__navbar.navbar .nav-link.show:focus-visible {
17636
+ outline-color: #143b76;
17637
+ }
17638
+ .bcl-header__navbar.navbar .dropdown-toggle:focus-visible,
17639
+ .bcl-header__navbar.navbar .nav-link:focus-visible {
17640
+ box-shadow: none;
17641
+ border: none;
17642
+ outline: 2px solid #fff;
17643
+ outline-offset: -8px;
17644
+ }
17645
+ .bcl-header__navbar.navbar .dropdown-toggle:after {
17646
+ background-color: #fff;
17647
+ -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0.625 0.725L1.19375 0.1375L4.99375 3.9625L8.80625 0.125L9.375 0.7125L4.99375 5.125L0.625 0.725Z' fill='black'/%3E%3C/svg%3E");
17648
+ -webkit-mask-repeat: no-repeat;
17649
+ -webkit-mask-size: contain;
17650
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0.625 0.725L1.19375 0.1375L4.99375 3.9625L8.80625 0.125L9.375 0.7125L4.99375 5.125L0.625 0.725Z' fill='black'/%3E%3C/svg%3E");
17651
+ mask-repeat: no-repeat;
17652
+ -webkit-mask-position: center;
17653
+ mask-position: center;
17654
+ mask-size: contain;
17655
+ display: inline-block;
17656
+ width: 10px;
17657
+ height: 10px;
17658
+ border: none;
17659
+ margin-top: 4px;
17660
+ }
17661
+ .bcl-header__navbar.navbar .dropdown-toggle:hover:after {
17662
+ background-color: #212529;
17663
+ }
17664
+ .bcl-header__navbar.navbar .dropdown-toggle.active:after {
17665
+ background-color: #143b76;
17666
+ }
17667
+ .bcl-header__navbar.navbar .dropdown-toggle.show:after {
17668
+ background-color: #143b76;
17669
+ -webkit-transform: rotate(180deg);
17670
+ transform: rotate(180deg);
17671
+ }
17672
+ .bcl-header__navbar.navbar .dropdown-toggle.no-chevron:after {
17673
+ display: none;
17674
+ }
17609
17675
  }
17610
17676
  .bcl-language-list-modal .btn-close {
17611
17677
  opacity: 1;
@@ -19538,19 +19604,6 @@ select.multi-select {
19538
19604
  background-color: var(--ss-highlight-color);
19539
19605
  }
19540
19606
 
19541
- .ss-sr-only {
19542
- position: absolute;
19543
- width: 1px;
19544
- height: 1px;
19545
- margin: -1px;
19546
- padding: 0;
19547
- border: 0;
19548
- clip: rect(0, 0, 0, 0);
19549
- -webkit-clip-path: inset(50%);
19550
- clip-path: inset(50%);
19551
- overflow: hidden;
19552
- }
19553
-
19554
19607
  .ss-main.multi-select.is-invalid,
19555
19608
  .was-validated .multi-select:invalid + .ss-main.multi-select {
19556
19609
  border-color: #eb3434;
@@ -19569,6 +19622,398 @@ select.multi-select {
19569
19622
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM12.0303 4.96967C11.7374 4.67678 11.2626 4.67678 10.9697 4.96967C10.9626 4.97674 10.9559 4.98424 10.9498 4.9921L7.4774 9.41674L5.38388 7.32322C5.09098 7.03033 4.61611 7.03033 4.32322 7.32322C4.03032 7.61612 4.03032 8.09099 4.32322 8.38388L6.96966 11.0303C7.26256 11.3232 7.73743 11.3232 8.03032 11.0303C8.03685 11.0238 8.043 11.0169 8.04876 11.0097L12.041 6.01947C12.3232 5.72582 12.3196 5.25897 12.0303 4.96967Z' fill='%2328A745'/%3E%3C/svg%3E%0A");
19570
19623
  }
19571
19624
 
19625
+ /* stylelint-disable no-descending-specificity, declaration-no-important */
19626
+ /* -------------------------------------
19627
+ Design tokens & helpers
19628
+ -------------------------------------- */
19629
+ /* Helpers */
19630
+ /* -------------------------------------
19631
+ Component
19632
+ -------------------------------------- */
19633
+ .bcl-mega-menu {
19634
+ --bcl-mega-menu-zindex: 40;
19635
+ }
19636
+
19637
+ @media (min-width: 992px) {
19638
+ .nav-item:has(> .bcl-mega-menu) {
19639
+ position: static;
19640
+ }
19641
+ }
19642
+
19643
+ .bcl-mega-menu__container :where(a) {
19644
+ text-decoration: none;
19645
+ }
19646
+ .bcl-mega-menu__container :where(a):hover {
19647
+ text-decoration: underline;
19648
+ }
19649
+ .bcl-mega-menu__container :where(a, button):focus-visible {
19650
+ outline: 2px solid #143b76;
19651
+ outline-offset: -2px;
19652
+ }
19653
+
19654
+ @media (min-width: 992px) {
19655
+ body:has(.bcl-mega-menu > [aria-expanded=true]) {
19656
+ overflow-y: hidden;
19657
+ }
19658
+ }
19659
+ @media (min-width: 992px) {
19660
+ .bcl-mega-menu:has(> [aria-expanded=true])::after {
19661
+ position: absolute;
19662
+ inset-inline: 0;
19663
+ background: #fff;
19664
+ opacity: 0.5;
19665
+ content: "";
19666
+ z-index: calc(var(--bcl-mega-menu-zindex) - 10);
19667
+ block-size: 300vw;
19668
+ }
19669
+ }
19670
+ .bcl-mega-menu__container[class] {
19671
+ display: none;
19672
+ z-index: var(--bcl-mega-menu-zindex);
19673
+ position: absolute;
19674
+ inset-block-start: 0;
19675
+ inset-inline-start: 0;
19676
+ inline-size: 100%;
19677
+ -webkit-margin-before: 0;
19678
+ margin-block-start: 0;
19679
+ padding: 0;
19680
+ border: 0;
19681
+ border-radius: 0;
19682
+ }
19683
+ .bcl-mega-menu > [aria-expanded=true] + .bcl-mega-menu__container[class] {
19684
+ display: block;
19685
+ }
19686
+ @media (min-width: 992px) {
19687
+ .bcl-mega-menu > [aria-expanded=true] + .bcl-mega-menu__container[class] {
19688
+ display: -ms-flexbox;
19689
+ display: flex;
19690
+ }
19691
+ }
19692
+ @media (prefers-reduced-motion: no-preference) {
19693
+ .bcl-mega-menu__container[class] {
19694
+ transition: opacity 0.15s ease, -webkit-transform 0.15s ease;
19695
+ transition: opacity 0.15s ease, transform 0.15s ease;
19696
+ transition: opacity 0.15s ease, transform 0.15s ease, -webkit-transform 0.15s ease;
19697
+ }
19698
+ .bcl-mega-menu > [aria-expanded=true] + .bcl-mega-menu__container[class] {
19699
+ opacity: 1;
19700
+ -webkit-transform: none;
19701
+ transform: none;
19702
+ }
19703
+ .bcl-mega-menu > [aria-expanded=false] + .bcl-mega-menu__container[class] {
19704
+ opacity: 0;
19705
+ -webkit-transform: translateY(-4px);
19706
+ transform: translateY(-4px);
19707
+ pointer-events: none;
19708
+ }
19709
+ }
19710
+ @media (min-width: 992px) {
19711
+ .bcl-mega-menu__container[class] {
19712
+ inset-block-start: 100%;
19713
+ padding-block: 0.75rem;
19714
+ border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
19715
+ }
19716
+ }
19717
+
19718
+ @media (min-width: 992px) {
19719
+ .bcl-mega-menu__container .shadow-container {
19720
+ position: relative;
19721
+ }
19722
+ .bcl-mega-menu__container .shadow-container .shadow-bg {
19723
+ position: absolute;
19724
+ inset-inline-start: 50%;
19725
+ inset-block-end: 0;
19726
+ inline-size: 100vw;
19727
+ block-size: 8px;
19728
+ -webkit-transform: translateX(-50%);
19729
+ transform: translateX(-50%);
19730
+ box-shadow: 0 4px 5px 0 rgba(224, 229, 245, 0.5);
19731
+ }
19732
+ }
19733
+ @media (min-width: 1200px) {
19734
+ .bcl-mega-menu__container .shadow-container {
19735
+ block-size: 100%;
19736
+ position: absolute;
19737
+ inset-inline-end: 0;
19738
+ inset-block-start: 0;
19739
+ }
19740
+ .bcl-mega-menu__container .shadow-container .shadow-bg {
19741
+ inset-inline-start: auto;
19742
+ inset-inline-end: 0;
19743
+ block-size: 100%;
19744
+ inline-size: 10px;
19745
+ -webkit-transform: none;
19746
+ transform: none;
19747
+ box-shadow: 4px 3px 4px 0 rgba(224, 229, 245, 0.5);
19748
+ }
19749
+ }
19750
+
19751
+ .bcl-mega-menu__back-button-block {
19752
+ position: relative;
19753
+ padding: 20px 0.25rem 0;
19754
+ }
19755
+ .bcl-mega-menu__back-button-block > .btn-link {
19756
+ text-decoration: none;
19757
+ }
19758
+ .bcl-mega-menu__back-button-block > .btn-link:hover {
19759
+ text-decoration: underline;
19760
+ }
19761
+
19762
+ .bcl-mega-menu__info > .content-block {
19763
+ padding: 1rem;
19764
+ background: tint-color(#253ebe, 90%);
19765
+ }
19766
+ @media (min-width: 992px) {
19767
+ .bcl-mega-menu__info > .content-block {
19768
+ -webkit-margin-end: 0;
19769
+ -moz-margin-end: 0;
19770
+ margin-inline-end: 0;
19771
+ background: #fff;
19772
+ -webkit-padding-end: 1.5rem;
19773
+ -moz-padding-end: 1.5rem;
19774
+ padding-inline-end: 1.5rem;
19775
+ max-block-size: 288px;
19776
+ overflow-y: auto;
19777
+ }
19778
+ }
19779
+ .bcl-mega-menu__info > .content-block > .content-link {
19780
+ text-decoration: none;
19781
+ }
19782
+ .bcl-mega-menu__info > .content-block > .content-link:hover {
19783
+ text-decoration: underline;
19784
+ }
19785
+
19786
+ ul.bcl-mega-menu__items {
19787
+ list-style: none;
19788
+ margin: 0;
19789
+ -webkit-padding-start: 0;
19790
+ -moz-padding-start: 0;
19791
+ padding-inline-start: 0;
19792
+ }
19793
+ @media (min-width: 992px) {
19794
+ ul.bcl-mega-menu__items {
19795
+ block-size: 288px;
19796
+ overflow-y: auto;
19797
+ }
19798
+ }
19799
+ @media (max-width: 991.98px) {
19800
+ ul.bcl-mega-menu__items {
19801
+ margin: 1rem 0 0;
19802
+ }
19803
+ }
19804
+ @media (max-width: 991.98px) {
19805
+ ul.bcl-mega-menu__items > li:not(:first-child) > * {
19806
+ border-top: 1px solid tint-color(#253ebe, 90%);
19807
+ }
19808
+ }
19809
+ ul.bcl-mega-menu__items > li > span,
19810
+ ul.bcl-mega-menu__items > li > a,
19811
+ ul.bcl-mega-menu__items > li > button {
19812
+ padding: 0.75rem 1rem;
19813
+ display: -ms-flexbox;
19814
+ display: flex;
19815
+ gap: 1rem;
19816
+ -ms-flex-pack: justify;
19817
+ justify-content: space-between;
19818
+ }
19819
+ ul.bcl-mega-menu__items > li > span > svg,
19820
+ ul.bcl-mega-menu__items > li > a > svg,
19821
+ ul.bcl-mega-menu__items > li > button > svg {
19822
+ -ms-flex-negative: 0;
19823
+ flex-shrink: 0;
19824
+ -ms-flex-item-align: center;
19825
+ -ms-grid-row-align: center;
19826
+ align-self: center;
19827
+ }
19828
+ ul.bcl-mega-menu__items > li > a {
19829
+ color: #1073de;
19830
+ text-decoration: none;
19831
+ }
19832
+ ul.bcl-mega-menu__items > li > a:hover {
19833
+ text-decoration: underline;
19834
+ }
19835
+ ul.bcl-mega-menu__items > li > a:hover,
19836
+ ul.bcl-mega-menu__items > li > button:hover {
19837
+ background: tint-color(#253ebe, 90%);
19838
+ }
19839
+ ul.bcl-mega-menu__items > li > span,
19840
+ ul.bcl-mega-menu__items > li > button {
19841
+ color: #212529;
19842
+ }
19843
+ ul.bcl-mega-menu__items > li > button {
19844
+ width: 100%;
19845
+ border: none;
19846
+ border-radius: 0;
19847
+ text-align: inherit;
19848
+ background: none;
19849
+ white-space: normal;
19850
+ }
19851
+ ul.bcl-mega-menu__items > li > button::after {
19852
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E");
19853
+ -ms-flex-negative: 0;
19854
+ flex-shrink: 0;
19855
+ -ms-flex-item-align: center;
19856
+ -ms-grid-row-align: center;
19857
+ align-self: center;
19858
+ content: "";
19859
+ height: 1em;
19860
+ width: 1em;
19861
+ }
19862
+ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
19863
+ background: tint-color(#253ebe, 90%);
19864
+ }
19865
+ @media (min-width: 992px) {
19866
+ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
19867
+ position: relative;
19868
+ }
19869
+ ul.bcl-mega-menu__items > li > button[aria-expanded=true]::before {
19870
+ content: "";
19871
+ position: absolute;
19872
+ width: 4px;
19873
+ top: 0;
19874
+ bottom: 0;
19875
+ left: 0;
19876
+ background-color: #143b76;
19877
+ }
19878
+ }
19879
+ ul.bcl-mega-menu__items > li:has(> a.see-all-button) {
19880
+ position: -webkit-sticky;
19881
+ position: sticky;
19882
+ inset-block-start: 100%;
19883
+ }
19884
+ ul.bcl-mega-menu__items > li > a.see-all-button {
19885
+ border-top: none;
19886
+ }
19887
+ ul.bcl-mega-menu__items > li > a.see-all-button:after {
19888
+ background: #b9c5e9;
19889
+ content: "";
19890
+ block-size: 1px;
19891
+ inset-inline-start: 0;
19892
+ position: absolute;
19893
+ inset-block-start: 0;
19894
+ inset-inline: 1rem;
19895
+ }
19896
+ ul.bcl-mega-menu__items > li > a.see-all-button > svg {
19897
+ inline-size: 0.8rem;
19898
+ }
19899
+ ul.bcl-mega-menu__items > li > a.see-all-button > span {
19900
+ text-overflow: ellipsis;
19901
+ overflow: hidden;
19902
+ display: block;
19903
+ white-space: nowrap;
19904
+ }
19905
+
19906
+ @media (min-width: 992px) {
19907
+ .bcl-mega-menu__menu {
19908
+ position: relative;
19909
+ padding-right: 0;
19910
+ }
19911
+ }
19912
+
19913
+ .bcl-mega-menu__submenu {
19914
+ position: absolute;
19915
+ background: white;
19916
+ display: -ms-flexbox;
19917
+ display: flex;
19918
+ -ms-flex-direction: column;
19919
+ flex-direction: column;
19920
+ }
19921
+ @media (max-width: 991.98px) {
19922
+ .bcl-mega-menu__submenu {
19923
+ inset: 0 0 auto;
19924
+ min-height: 100%;
19925
+ }
19926
+ }
19927
+ @media (min-width: 992px) {
19928
+ .bcl-mega-menu__submenu {
19929
+ block-size: 100%;
19930
+ inset: 0 0 0 100%;
19931
+ inline-size: 100%;
19932
+ }
19933
+ }
19934
+ @media (max-width: 991.98px) {
19935
+ .bcl-mega-menu__submenu:before {
19936
+ position: absolute;
19937
+ content: "";
19938
+ left: 50%;
19939
+ margin-left: -50vw;
19940
+ width: 100vw;
19941
+ top: 0;
19942
+ height: 100%;
19943
+ background: white;
19944
+ z-index: -1;
19945
+ }
19946
+ }
19947
+ @media (min-width: 992px) {
19948
+ .bcl-mega-menu__submenu {
19949
+ background: tint-color(#253ebe, 90%);
19950
+ }
19951
+ }
19952
+ .bcl-mega-menu__submenu > .__header > .__label {
19953
+ padding: 1rem 1rem;
19954
+ margin: 0;
19955
+ color: #212529;
19956
+ background: tint-color(#253ebe, 90%);
19957
+ display: block;
19958
+ font-size: 20px;
19959
+ }
19960
+ @media (min-width: 992px) {
19961
+ .bcl-mega-menu__submenu > .__header > .__label {
19962
+ display: none;
19963
+ }
19964
+ }
19965
+
19966
+ @media (min-width: 992px) {
19967
+ .bcl-mega-menu__second-submenu > .tab-content > .tab-pane {
19968
+ background: tint-color(#253ebe, 90%);
19969
+ }
19970
+ }
19971
+ @media (max-width: 991.98px) {
19972
+ .bcl-mega-menu__container:has(.bcl-mega-menu__second-submenu > .tab-content > .tab-pane.active) .bcl-mega-menu__info,
19973
+ .bcl-mega-menu__container:has(.bcl-mega-menu__second-submenu > .tab-content > .tab-pane.active) .bcl-mega-menu__first-submenu {
19974
+ display: none;
19975
+ }
19976
+ }
19977
+ .bcl-mega-menu__second-submenu > .tab-content > .tab-pane > .panel-title {
19978
+ padding: 1rem 1rem;
19979
+ margin: 0;
19980
+ color: #212529;
19981
+ background: tint-color(#253ebe, 90%);
19982
+ display: block;
19983
+ font-size: 20px;
19984
+ }
19985
+ @media (min-width: 992px) {
19986
+ .bcl-mega-menu__second-submenu > .tab-content > .tab-pane > .panel-title {
19987
+ display: none;
19988
+ }
19989
+ }
19990
+ @media (min-width: 1200px) {
19991
+ .bcl-mega-menu__second-submenu > .tab-content > .tab-pane > ul > li > * {
19992
+ margin: 0 0.75rem;
19993
+ }
19994
+ }
19995
+
19996
+ @media (max-width: 991.98px) {
19997
+ .bcl-mega-menu__submenu > .__header,
19998
+ .bcl-mega-menu .content-block,
19999
+ .bcl-mega-menu__back-button-block {
20000
+ position: relative;
20001
+ }
20002
+ .bcl-mega-menu__submenu > .__header::before,
20003
+ .bcl-mega-menu .content-block::before,
20004
+ .bcl-mega-menu__back-button-block::before {
20005
+ position: absolute;
20006
+ inset-inline-start: 50%;
20007
+ content: "";
20008
+ background: tint-color(#253ebe, 90%);
20009
+ inline-size: 100vw;
20010
+ block-size: 100%;
20011
+ inset-block-start: 0;
20012
+ z-index: -1;
20013
+ -webkit-transform: translateX(-50%);
20014
+ transform: translateX(-50%);
20015
+ }
20016
+ }
19572
20017
  @media (max-width: 767.98px) {
19573
20018
  .breadcrumb-item + .breadcrumb-item {
19574
20019
  padding-left: 0;