@openeuropa/bcl-theme-ucpkn 1.0.2 → 1.1.0

package/css/oe-bcl-ucpkn.css

@@ -2953,9 +2953,7 @@ textarea.form-control-lg {
   padding-top: 1.625rem;
   padding-bottom: 0.625rem;
 }
-.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
-.form-floating > .form-control-plaintext:focus,
-.form-floating > .form-control-plaintext:not(:placeholder-shown) {
+.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown), .form-floating > .form-control-plaintext:focus, .form-floating > .form-control-plaintext:not(:placeholder-shown) {
   padding-top: 1.625rem;
   padding-bottom: 0.625rem;
 }
@@ -3172,11 +3170,7 @@ textarea.form-control-lg {
   margin-left: 0.5em;
 }
 
-.was-validated .input-group > .form-control:not(:focus):valid, .input-group > .form-control:not(:focus).is-valid,
-.was-validated .input-group > .form-select:not(:focus):valid,
-.input-group > .form-select:not(:focus).is-valid,
-.was-validated .input-group > .form-floating:not(:focus-within):valid,
-.input-group > .form-floating:not(:focus-within).is-valid {
+.was-validated .input-group > .form-control:not(:focus):valid, .input-group > .form-control:not(:focus).is-valid, .was-validated .input-group > .form-select:not(:focus):valid, .input-group > .form-select:not(:focus).is-valid, .was-validated .input-group > .form-floating:not(:focus-within):valid, .input-group > .form-floating:not(:focus-within).is-valid {
   z-index: 3;
 }
 
@@ -3262,11 +3256,7 @@ textarea.form-control-lg {
   margin-left: 0.5em;
 }
 
-.was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid,
-.was-validated .input-group > .form-select:not(:focus):invalid,
-.input-group > .form-select:not(:focus).is-invalid,
-.was-validated .input-group > .form-floating:not(:focus-within):invalid,
-.input-group > .form-floating:not(:focus-within).is-invalid {
+.was-validated .input-group > .form-control:not(:focus):invalid, .input-group > .form-control:not(:focus).is-invalid, .was-validated .input-group > .form-select:not(:focus):invalid, .input-group > .form-select:not(:focus).is-invalid, .was-validated .input-group > .form-floating:not(:focus-within):invalid, .input-group > .form-floating:not(:focus-within).is-invalid {
   z-index: 4;
 }
 
@@ -6597,9 +6587,7 @@ textarea.form-control-lg {
     transition: none;
   }
 }
-.carousel-control-prev:hover, .carousel-control-prev:focus,
-.carousel-control-next:hover,
-.carousel-control-next:focus {
+.carousel-control-prev:hover, .carousel-control-prev:focus, .carousel-control-next:hover, .carousel-control-next:focus {
   color: #fff;
   text-decoration: none;
   outline: 0;
@@ -6839,8 +6827,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
   }
-}
-@media (max-width: 575.98px) {
   .offcanvas-sm.offcanvas-end {
     top: 0;
     right: 0;
@@ -6849,8 +6835,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
   }
-}
-@media (max-width: 575.98px) {
   .offcanvas-sm.offcanvas-top {
     top: 0;
     right: 0;
@@ -6861,8 +6845,6 @@ textarea.form-control-lg {
     -webkit-transform: translateY(-100%);
             transform: translateY(-100%);
   }
-}
-@media (max-width: 575.98px) {
   .offcanvas-sm.offcanvas-bottom {
     right: 0;
     left: 0;
@@ -6872,14 +6854,10 @@ textarea.form-control-lg {
     -webkit-transform: translateY(100%);
             transform: translateY(100%);
   }
-}
-@media (max-width: 575.98px) {
   .offcanvas-sm.showing, .offcanvas-sm.show:not(.hiding) {
     -webkit-transform: none;
             transform: none;
   }
-}
-@media (max-width: 575.98px) {
   .offcanvas-sm.showing, .offcanvas-sm.hiding, .offcanvas-sm.show {
     visibility: visible;
   }
@@ -6938,8 +6916,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
   }
-}
-@media (max-width: 767.98px) {
   .offcanvas-md.offcanvas-end {
     top: 0;
     right: 0;
@@ -6948,8 +6924,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
   }
-}
-@media (max-width: 767.98px) {
   .offcanvas-md.offcanvas-top {
     top: 0;
     right: 0;
@@ -6960,8 +6934,6 @@ textarea.form-control-lg {
     -webkit-transform: translateY(-100%);
             transform: translateY(-100%);
   }
-}
-@media (max-width: 767.98px) {
   .offcanvas-md.offcanvas-bottom {
     right: 0;
     left: 0;
@@ -6971,14 +6943,10 @@ textarea.form-control-lg {
     -webkit-transform: translateY(100%);
             transform: translateY(100%);
   }
-}
-@media (max-width: 767.98px) {
   .offcanvas-md.showing, .offcanvas-md.show:not(.hiding) {
     -webkit-transform: none;
             transform: none;
   }
-}
-@media (max-width: 767.98px) {
   .offcanvas-md.showing, .offcanvas-md.hiding, .offcanvas-md.show {
     visibility: visible;
   }
@@ -7037,8 +7005,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
   }
-}
-@media (max-width: 991.98px) {
   .offcanvas-lg.offcanvas-end {
     top: 0;
     right: 0;
@@ -7047,8 +7013,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
   }
-}
-@media (max-width: 991.98px) {
   .offcanvas-lg.offcanvas-top {
     top: 0;
     right: 0;
@@ -7059,8 +7023,6 @@ textarea.form-control-lg {
     -webkit-transform: translateY(-100%);
             transform: translateY(-100%);
   }
-}
-@media (max-width: 991.98px) {
   .offcanvas-lg.offcanvas-bottom {
     right: 0;
     left: 0;
@@ -7070,14 +7032,10 @@ textarea.form-control-lg {
     -webkit-transform: translateY(100%);
             transform: translateY(100%);
   }
-}
-@media (max-width: 991.98px) {
   .offcanvas-lg.showing, .offcanvas-lg.show:not(.hiding) {
     -webkit-transform: none;
             transform: none;
   }
-}
-@media (max-width: 991.98px) {
   .offcanvas-lg.showing, .offcanvas-lg.hiding, .offcanvas-lg.show {
     visibility: visible;
   }
@@ -7136,8 +7094,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
   }
-}
-@media (max-width: 1199.98px) {
   .offcanvas-xl.offcanvas-end {
     top: 0;
     right: 0;
@@ -7146,8 +7102,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
   }
-}
-@media (max-width: 1199.98px) {
   .offcanvas-xl.offcanvas-top {
     top: 0;
     right: 0;
@@ -7158,8 +7112,6 @@ textarea.form-control-lg {
     -webkit-transform: translateY(-100%);
             transform: translateY(-100%);
   }
-}
-@media (max-width: 1199.98px) {
   .offcanvas-xl.offcanvas-bottom {
     right: 0;
     left: 0;
@@ -7169,14 +7121,10 @@ textarea.form-control-lg {
     -webkit-transform: translateY(100%);
             transform: translateY(100%);
   }
-}
-@media (max-width: 1199.98px) {
   .offcanvas-xl.showing, .offcanvas-xl.show:not(.hiding) {
     -webkit-transform: none;
             transform: none;
   }
-}
-@media (max-width: 1199.98px) {
   .offcanvas-xl.showing, .offcanvas-xl.hiding, .offcanvas-xl.show {
     visibility: visible;
   }
@@ -7235,8 +7183,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(-100%);
             transform: translateX(-100%);
   }
-}
-@media (max-width: 1399.98px) {
   .offcanvas-xxl.offcanvas-end {
     top: 0;
     right: 0;
@@ -7245,8 +7191,6 @@ textarea.form-control-lg {
     -webkit-transform: translateX(100%);
             transform: translateX(100%);
   }
-}
-@media (max-width: 1399.98px) {
   .offcanvas-xxl.offcanvas-top {
     top: 0;
     right: 0;
@@ -7257,8 +7201,6 @@ textarea.form-control-lg {
     -webkit-transform: translateY(-100%);
             transform: translateY(-100%);
   }
-}
-@media (max-width: 1399.98px) {
   .offcanvas-xxl.offcanvas-bottom {
     right: 0;
     left: 0;
@@ -7268,14 +7210,10 @@ textarea.form-control-lg {
     -webkit-transform: translateY(100%);
             transform: translateY(100%);
   }
-}
-@media (max-width: 1399.98px) {
   .offcanvas-xxl.showing, .offcanvas-xxl.show:not(.hiding) {
     -webkit-transform: none;
             transform: none;
   }
-}
-@media (max-width: 1399.98px) {
   .offcanvas-xxl.showing, .offcanvas-xxl.hiding, .offcanvas-xxl.show {
     visibility: visible;
   }
@@ -14902,7 +14840,7 @@ em.placeholder {
 }
 .bcl-header__navbar input:active,
 .bcl-header__navbar input:focus {
-  box-shadow: 0 0 0 0.25rem hsla(210deg, 2%, 83%, 0.5);
+  box-shadow: 0 0 0 0.25rem hsla(210, 2%, 83%, 0.5);
 }
 
 .bcl-header--ec,
@@ -15467,24 +15405,7 @@ textarea.form-control.is-valid,
 .badge .icon--close {
   display: -ms-inline-flexbox;
   display: inline-flex;
-  width: 12px;
-  height: 12px;
-  margin-left: 0.3rem;
-  font-size: 1em;
-  font-weight: 300;
-  -ms-flex-pack: center;
-      justify-content: center;
-  -ms-flex-align: center;
-      align-items: center;
-  background: #fff;
-  border-radius: 50%;
-  border: none;
-  padding: 0;
-}
-.badge .icon--close svg {
-  width: 6px;
-  height: 6px;
-  margin: 0;
+  margin-left: 0.5rem;
 }
 
 a.badge {
@@ -15498,10 +15419,6 @@ a.badge:focus-visible {
 .badge.bg-primary {
   color: #fff;
 }
-.badge.bg-primary a .icon--close,
-.badge.bg-primary .icon--close {
-  color: #221684;
-}
 
 .badge-outline-primary a {
   color: #221684 !important;
@@ -15512,10 +15429,6 @@ a.badge:focus-visible {
   border: 1px solid #221684;
   color: #221684 !important;
 }
-.badge-outline-primary .icon--close {
-  background: #221684;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-primary, a.badge:active.badge-outline-primary, a.badge:hover.badge-outline-primary {
   background-color: #e9e8f3 !important;
@@ -15535,10 +15448,6 @@ a.badge.badge-outline-primary:focus {
 .badge.bg-secondary {
   color: #fff;
 }
-.badge.bg-secondary a .icon--close,
-.badge.bg-secondary .icon--close {
-  color: #f25924;
-}
 
 .badge-outline-secondary a {
   color: #f25924 !important;
@@ -15549,10 +15458,6 @@ a.badge.badge-outline-primary:focus {
   border: 1px solid #f25924;
   color: #f25924 !important;
 }
-.badge-outline-secondary .icon--close {
-  background: #f25924;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-secondary, a.badge:active.badge-outline-secondary, a.badge:hover.badge-outline-secondary {
   background-color: #feeee9 !important;
@@ -15572,10 +15477,6 @@ a.badge.badge-outline-secondary:focus {
 .badge.bg-success {
   color: #fff;
 }
-.badge.bg-success a .icon--close,
-.badge.bg-success .icon--close {
-  color: #3c8f38;
-}
 
 .badge-outline-success a {
   color: #3c8f38 !important;
@@ -15586,10 +15487,6 @@ a.badge.badge-outline-secondary:focus {
   border: 1px solid #3c8f38;
   color: #3c8f38 !important;
 }
-.badge-outline-success .icon--close {
-  background: #3c8f38;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-success, a.badge:active.badge-outline-success, a.badge:hover.badge-outline-success {
   background-color: #ecf4eb !important;
@@ -15609,10 +15506,6 @@ a.badge.badge-outline-success:focus {
 .badge.bg-info {
   color: #fff;
 }
-.badge.bg-info a .icon--close,
-.badge.bg-info .icon--close {
-  color: #2b768a;
-}
 
 .badge-outline-info a {
   color: #2b768a !important;
@@ -15623,10 +15516,6 @@ a.badge.badge-outline-success:focus {
   border: 1px solid #2b768a;
   color: #2b768a !important;
 }
-.badge-outline-info .icon--close {
-  background: #2b768a;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-info, a.badge:active.badge-outline-info, a.badge:hover.badge-outline-info {
   background-color: #eaf1f3 !important;
@@ -15646,11 +15535,6 @@ a.badge.badge-outline-info:focus {
 .badge.bg-warning {
   color: #000;
 }
-.badge.bg-warning a .icon--close,
-.badge.bg-warning .icon--close {
-  color: #e1ab00;
-  background: #000;
-}
 
 .badge-outline-warning a {
   color: #e1ab00 !important;
@@ -15661,10 +15545,6 @@ a.badge.badge-outline-info:focus {
   border: 1px solid #e1ab00;
   color: #e1ab00 !important;
 }
-.badge-outline-warning .icon--close {
-  background: #e1ab00;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-warning, a.badge:active.badge-outline-warning, a.badge:hover.badge-outline-warning {
   background-color: #fcf7e6 !important;
@@ -15684,10 +15564,6 @@ a.badge.badge-outline-warning:focus {
 .badge.bg-danger {
   color: #fff;
 }
-.badge.bg-danger a .icon--close,
-.badge.bg-danger .icon--close {
-  color: #b8282a;
-}
 
 .badge-outline-danger a {
   color: #b8282a !important;
@@ -15698,10 +15574,6 @@ a.badge.badge-outline-warning:focus {
   border: 1px solid #b8282a;
   color: #b8282a !important;
 }
-.badge-outline-danger .icon--close {
-  background: #b8282a;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-danger, a.badge:active.badge-outline-danger, a.badge:hover.badge-outline-danger {
   background-color: #f8eaea !important;
@@ -15721,11 +15593,6 @@ a.badge.badge-outline-danger:focus {
 .badge.bg-light {
   color: #000;
 }
-.badge.bg-light a .icon--close,
-.badge.bg-light .icon--close {
-  color: #f0f0f0;
-  background: #000;
-}
 
 .badge-outline-light a {
   color: #f0f0f0 !important;
@@ -15736,10 +15603,6 @@ a.badge.badge-outline-danger:focus {
   border: 1px solid #f0f0f0;
   color: #f0f0f0 !important;
 }
-.badge-outline-light .icon--close {
-  background: #f0f0f0;
-  color: #000;
-}
 
 a.badge:focus-within.badge-outline-light, a.badge:active.badge-outline-light, a.badge:hover.badge-outline-light {
   border-color: #fff;
@@ -15760,10 +15623,6 @@ a.badge.badge-outline-light:focus {
 .badge.bg-dark {
   color: #fff;
 }
-.badge.bg-dark a .icon--close,
-.badge.bg-dark .icon--close {
-  color: #2e3338;
-}
 
 .badge-outline-dark a {
   color: #2e3338 !important;
@@ -15774,10 +15633,6 @@ a.badge.badge-outline-light:focus {
   border: 1px solid #2e3338;
   color: #2e3338 !important;
 }
-.badge-outline-dark .icon--close {
-  background: #2e3338;
-  color: #fff;
-}
 
 a.badge:focus-within.badge-outline-dark, a.badge:active.badge-outline-dark, a.badge:hover.badge-outline-dark {
   background-color: #f0f0f0 !important;
@@ -16313,6 +16168,10 @@ select.multi-select {
 .ss-main.multi-select {
   padding: 0;
 }
+.ss-main.multi-select.form-select.is-invalid, .ss-main.multi-select.form-select.is-valid {
+  background: none;
+  padding: 0;
+}
 .ss-main.multi-select .ss-values {
   font-size: calc(1.275rem + 0.3vw);
 }
@@ -16378,7 +16237,7 @@ select.multi-select {
 .was-validated .multi-select:valid + .ss-main.multi-select .ss-multi-selected {
   background-repeat: no-repeat;
   background-position: right 1.5rem center;
-  background-size: 1rem 1rem;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
 }
 
 .ss-main.multi-select.is-invalid .ss-multi-selected,