@clayui/css 3.42.0 → 3.44.2

package/lib/css/base.css

@@ -1331,10 +1331,6 @@ input[type=button].btn-block {
   padding: 0;
   width: 100%;
 }
-.btn-monospaced.btn .lexicon-icon {
-  margin-top: 0;
-}
-
 .btn-group-vertical > .btn-monospaced.btn-lg, .btn-group-lg .btn-monospaced, .btn-monospaced.btn-lg {
   height: 3rem;
   width: 3rem;
@@ -1382,6 +1378,12 @@ input[type=button].btn-block {
   border-color: #005cbf;
   color: #fff;
 }
+.form-file-input:focus + .btn-primary {
+  background-color: #0069d9;
+  border-color: #0062cc;
+  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
+  color: #fff;
+}
 .btn-secondary {
   background-color: #6c757d;
   border-color: #6c757d;
@@ -1421,6 +1423,12 @@ input[type=button].btn-block {
   border-color: #4e555b;
   color: #fff;
 }
+.form-file-input:focus + .btn-secondary {
+  background-color: #5a6268;
+  border-color: #545b62;
+  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
+  color: #fff;
+}
 .btn-success {
   background-color: #28a745;
   border-color: #28a745;
@@ -1460,6 +1468,12 @@ input[type=button].btn-block {
   border-color: #1c7430;
   color: #fff;
 }
+.form-file-input:focus + .btn-success {
+  background-color: #218838;
+  border-color: #1e7e34;
+  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
+  color: #fff;
+}
 .btn-info {
   background-color: #17a2b8;
   border-color: #17a2b8;
@@ -1538,6 +1552,12 @@ input[type=button].btn-block {
   border-color: #c69500;
   color: #212529;
 }
+.form-file-input:focus + .btn-warning {
+  background-color: #e0a800;
+  border-color: #d39e00;
+  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
+  color: #212529;
+}
 .btn-danger {
   background-color: #dc3545;
   border-color: #dc3545;
@@ -1577,6 +1597,12 @@ input[type=button].btn-block {
   border-color: #b21f2d;
   color: #fff;
 }
+.form-file-input:focus + .btn-danger {
+  background-color: #c82333;
+  border-color: #bd2130;
+  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
+  color: #fff;
+}
 .btn-light {
   background-color: #f8f9fa;
   border-color: #f8f9fa;
@@ -1616,6 +1642,12 @@ input[type=button].btn-block {
   border-color: #d3d9df;
   color: #212529;
 }
+.form-file-input:focus + .btn-light {
+  background-color: #e2e6ea;
+  border-color: #dae0e5;
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+  color: #212529;
+}
 .btn-dark {
   background-color: #343a40;
   border-color: #343a40;
@@ -1655,6 +1687,12 @@ input[type=button].btn-block {
   border-color: #171a1d;
   color: #fff;
 }
+.form-file-input:focus + .btn-dark {
+  background-color: #23272b;
+  border-color: #1d2124;
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+  color: #fff;
+}
 .btn-link {
   border-radius: 1px;
   color: #007bff;
@@ -3263,6 +3301,7 @@ input[type=button].btn-block {
   margin-bottom: 1rem;
   padding: 0.75rem 1.25rem;
   position: relative;
+  white-space: normal;
   overflow-wrap: break-word;
   word-wrap: break-word;
 }
@@ -5567,31 +5606,22 @@ input[type=button].btn-block {
   margin-top: 0;
   padding-left: 0;
 }
-.form-check-card .card {
-  margin-bottom: 0;
-}
-.form-check-card .custom-control {
-  display: inline;
-  margin-right: 0;
-  position: static;
-}
-.form-check-card .custom-control > label {
-  font-weight: 400;
-  padding-left: 0;
+.form-check-card:hover .card {
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-.form-check-card .custom-control-input {
-  z-index: 2;
+.form-check-card.active .card {
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-.form-check-card .custom-control-label {
-  position: absolute;
-  z-index: 1;
+.form-check-card.checked .card {
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-.form-check-card .custom-control-label::before, .form-check-card .custom-control-label::after {
-  top: 0;
+.form-check-card .card {
+  margin-bottom: 0;
 }
 .form-check-card .form-check-input {
   margin-left: 0;
   margin-top: 0;
+  opacity: 0;
   position: absolute;
   z-index: 1;
 }
@@ -5602,21 +5632,35 @@ input[type=button].btn-block {
   padding-left: 0;
   position: static;
 }
-.form-check-card.active .card,
-.form-check-card .custom-control-input:checked ~ .card,
-.form-check-card .form-check-input:checked ~ .card {
-  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
+.form-check-card .custom-control {
+  display: inline;
+  margin-right: 0;
+  position: static;
 }
-
-.form-check-card:hover .card {
+.form-check-card .custom-control label {
+  font-weight: 400;
+  padding-left: 0;
+}
+.form-check-card .custom-control .custom-control-label {
+  opacity: 0;
+  position: absolute;
+  z-index: 1;
+}
+.form-check-card .custom-control .custom-control-label::before {
+  top: 0;
+}
+.form-check-card .custom-control .custom-control-label::after {
+  top: 0;
+}
+.form-check-card .custom-control .custom-control-input {
+  z-index: 2;
+}
+.form-check-card .custom-control .custom-control-input:checked ~ .card {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-
-.custom-control-input:hover ~ .card,
-.form-check-input:hover ~ .card {
+.form-check-card .form-check-input:checked ~ .card {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-
 .form-check-bottom-left .card-horizontal > .card-body,
 .form-check-middle-left .card-horizontal > .card-body,
 .form-check-top-left .card-horizontal > .card-body {
@@ -5629,61 +5673,129 @@ input[type=button].btn-block {
   padding-right: 40px;
 }
 
-.form-check-bottom-left .custom-control-input,
-.form-check-bottom-left .custom-control-label,
 .form-check-bottom-left .form-check-input {
+  bottom: 1rem;
+  left: 1rem;
+  opacity: 1;
+  top: auto;
+  transform: none;
+}
+.form-check-bottom-left .custom-control .custom-control-label {
+  bottom: 1rem;
+  left: 1rem;
+  opacity: 1;
+  top: auto;
+  transform: none;
+}
+.form-check-bottom-left .custom-control .custom-control-input {
   bottom: 1rem;
   left: 1rem;
   top: auto;
   transform: none;
 }
-
-.form-check-bottom-right .custom-control-input,
-.form-check-bottom-right .custom-control-label,
 .form-check-bottom-right .form-check-input {
+  bottom: 1rem;
+  left: auto;
+  opacity: 1;
+  right: 1rem;
+  top: auto;
+  transform: none;
+}
+.form-check-bottom-right .custom-control .custom-control-label {
+  bottom: 1rem;
+  left: auto;
+  opacity: 1;
+  right: 1rem;
+  top: auto;
+  transform: none;
+}
+.form-check-bottom-right .custom-control .custom-control-input {
   bottom: 1rem;
   left: auto;
   right: 1rem;
   top: auto;
   transform: none;
 }
-
-.form-check-middle-left .custom-control-input,
-.form-check-middle-left .custom-control-label,
 .form-check-middle-left .form-check-input {
+  left: 1rem;
+  margin-top: 0;
+  opacity: 1;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.form-check-middle-left .custom-control .custom-control-label {
+  left: 1rem;
+  margin-top: 0;
+  opacity: 1;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.form-check-middle-left .custom-control .custom-control-input {
   left: 1rem;
   margin-top: 0;
   top: 50%;
   transform: translateY(-50%);
 }
-
-.form-check-middle-right .custom-control-input,
-.form-check-middle-right .custom-control-label,
 .form-check-middle-right .form-check-input {
+  left: auto;
+  margin-top: 0;
+  opacity: 1;
+  right: 1rem;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.form-check-middle-right .custom-control .custom-control-label {
+  left: auto;
+  margin-top: 0;
+  opacity: 1;
+  right: 1rem;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.form-check-middle-right .custom-control .custom-control-input {
   left: auto;
   margin-top: 0;
   right: 1rem;
   top: 50%;
   transform: translateY(-50%);
 }
-
-.form-check-top-left .custom-control-input,
-.form-check-top-left .custom-control-label,
 .form-check-top-left .form-check-input {
+  left: 1rem;
+  opacity: 1;
+  top: 1rem;
+  transform: none;
+}
+.form-check-top-left .custom-control .custom-control-label {
+  left: 1rem;
+  opacity: 1;
+  top: 1rem;
+  transform: none;
+}
+.form-check-top-left .custom-control .custom-control-input {
   left: 1rem;
   top: 1rem;
   transform: none;
 }
-
-.form-check-top-right .custom-control-input,
-.form-check-top-right .custom-control-label,
 .form-check-top-right .form-check-input {
+  left: auto;
+  opacity: 1;
+  right: 1rem;
+  top: 1rem;
+  transform: none;
+}
+.form-check-top-right .custom-control .custom-control-label {
+  left: auto;
+  opacity: 1;
+  right: 1rem;
+  top: 1rem;
+  transform: none;
+}
+.form-check-top-right .custom-control .custom-control-input {
   left: auto;
   right: 1rem;
   top: 1rem;
   transform: none;
 }
-
 .card-page.card-page-equal-height .card-page-item,
 .card-page.card-page-equal-height .card-page-item-asset,
 .card-page.card-page-equal-height .card-page-item-directory {
@@ -6081,7 +6193,6 @@ input[type=button].btn-block {
   position: relative;
   text-align: inherit;
   transition: none;
-  white-space: normal;
   width: 100%;
   overflow-wrap: break-word;
   word-wrap: break-word;
@@ -6145,6 +6256,23 @@ input[type=button].btn-block {
   margin-top: -0.25rem;
   width: auto;
 }
+.dropdown-item.autofit-row {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+.dropdown-item.autofit-row > .autofit-col {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+.dropdown-item .autofit-row {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
+  width: auto;
+}
+.dropdown-item .autofit-row > .autofit-col {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
 .dropdown-item .c-kbd-inline {
   line-height: 1.5rem;
 }
@@ -6608,6 +6736,10 @@ input[type=button].btn-block {
   }
 }
 
+.dropdown-menu-width-shrink {
+  min-width: 0;
+  white-space: nowrap;
+}
 .dropdown-menu-width-full {
   left: 12px !important;
   right: 12px !important;
@@ -8866,7 +8998,6 @@ label.custom-control-label {
   padding-right: 0.25rem;
   background-color: transparent;
 }
-
 .date-picker-dropdown-menu {
   max-height: none;
   max-width: 370px;
@@ -9631,15 +9762,36 @@ label.custom-control-label {
 .input-group .btn-unstyled {
   color: inherit;
 }
-
 .input-group-item {
   display: flex;
   flex-grow: 1;
   flex-wrap: wrap;
   margin-left: 0.5rem;
   width: 1%;
+  overflow-wrap: break-word;
   word-wrap: break-word;
 }
+.input-group-item.focus {
+  border-radius: 0.25rem;
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
+}
+.input-group-item.focus.input-group-prepend {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+  z-index: 1;
+}
+.input-group-item.focus.input-group-append {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+.input-group-item.focus > .form-control {
+  background-color: #fff;
+  border-color: #80bdff;
+}
+.input-group-item.focus > .input-group-inset-item {
+  background-color: #fff;
+  border-color: #80bdff;
+}
 .input-group-item:first-child {
   margin-left: 0;
 }
@@ -9649,25 +9801,24 @@ label.custom-control-label {
 .input-group-item > .dropdown {
   display: flex;
   flex-wrap: wrap;
+  overflow-wrap: break-word;
   word-wrap: break-word;
   width: 100%;
 }
-
 .input-group-item-shrink {
   flex-grow: 0;
   width: auto;
 }
-
 .input-group-text {
   align-items: center;
   background-color: #e9ecef;
-  border-color: #ced4da;
-  border-style: solid;
   border-bottom-width: 0.0625rem;
+  border-color: #ced4da;
   border-left-width: 0.0625rem;
+  border-radius: 0.25rem;
   border-right-width: 0.0625rem;
+  border-style: solid;
   border-top-width: 0.0625rem;
-  border-radius: 0.25rem;
   color: #495057;
   display: flex;
   font-size: 1rem;
@@ -9687,18 +9838,19 @@ label.custom-control-label {
 .input-group-text label {
   color: #495057;
 }
-.input-group-text input[type=radio],
-.input-group-text input[type=checkbox] {
-  margin-top: 0;
+.input-group-text .custom-control {
+  margin-bottom: 0;
 }
-.input-group-text .custom-control,
 .input-group-text .form-check {
   margin-bottom: 0;
 }
+.input-group-text .form-check input[type=radio],
+.input-group-text .form-check input[type=checkbox] {
+  margin-top: 0;
+}
 .input-group-text .lexicon-icon {
   margin-top: 0;
 }
-
 .input-group-text-secondary {
   background-color: #6c757d;
   border-color: #6c757d;
@@ -9709,7 +9861,6 @@ label.custom-control-label {
 .input-group-text-secondary label {
   color: #fff;
 }
-
 @media (max-width: 575.98px) {
   .input-group-stacked-sm-down > .input-group-item {
     margin-bottom: 0.5rem;
@@ -9724,6 +9875,17 @@ label.custom-control-label {
 
 .input-group-lg > .input-group-item > .btn {
   font-size: 1.25rem;
+  line-height: 1.5;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 0.5rem;
+}
+.input-group-lg > .input-group-item > .btn .c-inner {
+  margin-bottom: -0.5rem;
+  margin-left: -1rem;
+  margin-right: -1rem;
+  margin-top: -0.5rem;
 }
 .input-group-lg > .input-group-item > .btn .btn-section {
   font-size: 0.8125rem;
@@ -9733,7 +9895,17 @@ label.custom-control-label {
   line-height: 1;
   width: 3rem;
 }
-.input-group-lg > .input-group-item > .form-control,
+.input-group-lg > .input-group-item > .form-control {
+  border-radius: 0.3rem;
+  font-size: 1.25rem;
+  height: auto;
+  line-height: 1.5;
+  min-height: 3rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 0.5rem;
+}
 .input-group-lg > .input-group-item > .form-file .btn {
   border-radius: 0.3rem;
   font-size: 1.25rem;
@@ -9744,6 +9916,12 @@ label.custom-control-label {
   padding-right: 1rem;
   padding-top: 0.5rem;
 }
+.input-group-lg > .input-group-item > .form-file .btn .c-inner {
+  margin-bottom: -0.5rem;
+  margin-left: -1rem;
+  margin-right: -1rem;
+  margin-top: -0.5rem;
+}
 .input-group-lg > .input-group-item > textarea.form-control,
 .input-group-lg > .input-group-item > .form-control-textarea {
   height: 190px;
@@ -9763,25 +9941,39 @@ label.custom-control-label {
   padding-left: 1rem;
   padding-right: 1rem;
 }
-.input-group-lg > .input-group-item > .input-group-inset-item > .form-file {
-  height: 75%;
-}
 .input-group-lg > .input-group-item > .input-group-inset-item > .form-file .btn {
-  height: 100%;
-  line-height: 1;
-  padding-bottom: 0;
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  padding-top: 0;
+  border-radius: 0.3rem;
+  font-size: 1.25rem;
+  height: 3rem;
+  line-height: 1.5;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 0.5rem;
 }
 .input-group-lg > .input-group-item > .input-group-inset-item > .form-file .btn .c-inner {
+  margin-bottom: -0.5rem;
+  margin-left: -1rem;
+  margin-right: -1rem;
+  margin-top: -0.5rem;
+}
+.input-group-lg > .input-group-item .form-control-inset {
   margin-bottom: 0;
-  margin-left: -0.75rem;
-  margin-right: -0.75rem;
   margin-top: 0;
 }
 .form-group-sm .input-group > .input-group-item > .btn, .input-group-sm > .input-group-item > .btn {
   font-size: 0.875rem;
+  line-height: 1.5;
+  padding-bottom: 0.25rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  padding-top: 0.25rem;
+}
+.form-group-sm .input-group > .input-group-item > .btn .c-inner, .input-group-sm > .input-group-item > .btn .c-inner {
+  margin-bottom: -0.25rem;
+  margin-left: -0.5rem;
+  margin-right: -0.5rem;
+  margin-top: -0.25rem;
 }
 .form-group-sm .input-group > .input-group-item > .btn .btn-section, .input-group-sm > .input-group-item > .btn .btn-section {
   font-size: 0.5625rem;
@@ -9791,30 +9983,49 @@ label.custom-control-label {
   line-height: 1;
   width: 1.9375rem;
 }
-.form-group-sm .input-group > .input-group-item > .form-control, .input-group-sm > .input-group-item > .form-control,
-.form-group-sm .input-group > .input-group-item > .form-file .btn,
-.input-group-sm > .input-group-item > .form-file .btn {
+.form-group-sm .input-group > .input-group-item > .form-control, .input-group-sm > .input-group-item > .form-control {
   border-radius: 0.2rem;
   font-size: 0.875rem;
-  height: 1.9375rem;
+  height: auto;
   line-height: 1.5;
-  padding-bottom: 0.25rem;
+  min-height: 1.9375rem;
+  padding-bottom: 0;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
-  padding-top: 0.25rem;
+  padding-top: 0;
 }
-.form-group-sm .input-group > .input-group-item > .form-control-plaintext, .input-group-sm > .input-group-item > .form-control-plaintext {
+.form-group-sm .input-group > .input-group-item > .form-control .label, .input-group-sm > .input-group-item > .form-control .label {
+  margin-bottom: 0.1875rem;
+  margin-top: 0.1875rem;
+}
+.form-group-sm .input-group > .input-group-item > .form-file .btn, .input-group-sm > .input-group-item > .form-file .btn {
+  border-radius: 0.2rem;
   font-size: 0.875rem;
   height: 1.9375rem;
   line-height: 1.5;
   padding-bottom: 0.25rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
   padding-top: 0.25rem;
 }
+.form-group-sm .input-group > .input-group-item > .form-file .btn .c-inner, .input-group-sm > .input-group-item > .form-file .btn .c-inner {
+  margin-bottom: -0.25rem;
+  margin-left: -0.5rem;
+  margin-right: -0.5rem;
+  margin-top: -0.25rem;
+}
 .form-group-sm .input-group > .input-group-item > textarea.form-control, .input-group-sm > .input-group-item > textarea.form-control,
 .form-group-sm .input-group > .input-group-item > .form-control-textarea,
 .input-group-sm > .input-group-item > .form-control-textarea {
   height: 120px;
 }
+.form-group-sm .input-group > .input-group-item > .form-control-plaintext, .input-group-sm > .input-group-item > .form-control-plaintext {
+  font-size: 0.875rem;
+  height: 1.9375rem;
+  line-height: 1.5;
+  padding-bottom: 0.25rem;
+  padding-top: 0.25rem;
+}
 .form-group-sm .input-group > .input-group-item > .input-group-text, .input-group-sm > .input-group-item > .input-group-text {
   border-radius: 0.2rem;
   font-size: 0.875rem;
@@ -9842,67 +10053,48 @@ label.custom-control-label {
   margin-right: 0.25rem;
   width: 1.5rem;
 }
-.form-group-sm .input-group > .input-group-item > .input-group-inset-item > .form-file, .input-group-sm > .input-group-item > .input-group-inset-item > .form-file {
-  height: 75%;
-}
 .form-group-sm .input-group > .input-group-item > .input-group-inset-item > .form-file .btn, .input-group-sm > .input-group-item > .input-group-inset-item > .form-file .btn {
-  height: 100%;
-  line-height: 1;
-  padding-bottom: 0;
+  border-radius: 0.2rem;
+  font-size: 0.875rem;
+  height: 1.9375rem;
+  line-height: 1.5;
+  padding-bottom: 0.25rem;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
-  padding-top: 0;
+  padding-top: 0.25rem;
 }
 .form-group-sm .input-group > .input-group-item > .input-group-inset-item > .form-file .btn .c-inner, .input-group-sm > .input-group-item > .input-group-inset-item > .form-file .btn .c-inner {
-  margin-bottom: 0;
+  margin-bottom: -0.25rem;
   margin-left: -0.5rem;
   margin-right: -0.5rem;
-  margin-top: 0;
-}
-.input-group-item.focus {
-  border-radius: 0.25rem;
-  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
-}
-.input-group-item.focus .form-control,
-.input-group-item.focus .form-control[readonly] ~ .input-group-inset-item,
-.input-group-item.focus .input-group-inset-item {
-  background-color: #fff;
-  border-color: #80bdff;
-}
-
-.input-group-item.input-group-prepend.focus {
-  border-bottom-right-radius: 0;
-  border-top-right-radius: 0;
-  z-index: 1;
+  margin-top: -0.25rem;
 }
-
-.input-group-item.input-group-append.focus {
-  border-bottom-left-radius: 0;
-  border-top-left-radius: 0;
+.form-group-sm .input-group > .input-group-item .form-control-inset, .input-group-sm > .input-group-item .form-control-inset {
+  margin-bottom: 0.125rem;
+  margin-top: 0.1875rem;
 }
-
 .input-group-inset {
   flex-grow: 1;
   order: 5;
   width: 1%;
 }
-.input-group-inset[readonly] ~ .input-group-inset-item {
-  background-color: #e9ecef;
-}
-.input-group-inset:focus {
+.input-group-inset:focus, .input-group-inset.focus {
   box-shadow: none;
 }
-.input-group-inset:focus ~ .input-group-inset-item {
+.input-group-inset:focus ~ .input-group-inset-item, .input-group-inset.focus ~ .input-group-inset-item {
   background-color: #fff;
   border-color: #80bdff;
 }
-.input-group-inset:disabled ~ .input-group-inset-item {
+.input-group-inset:disabled ~ .input-group-inset-item, .input-group-inset.disabled ~ .input-group-inset-item {
   background-color: #e9ecef;
 }
 .input-group-inset ~ .form-feedback-group {
   order: 13;
 }
 
+.input-group-inset[readonly] ~ .input-group-inset-item {
+  background-color: #e9ecef;
+}
 .input-group .input-group-inset-item {
   align-items: center;
   background-color: #fff;
@@ -11484,7 +11676,6 @@ label.custom-control-label {
   margin-left: 0;
   margin-right: 0;
 }
-
 .nav-btn-monospaced {
   padding: 0;
 }
@@ -11506,6 +11697,7 @@ label.custom-control-label {
 }
 
 .nav-item {
+  overflow-wrap: break-word;
   word-wrap: break-word;
 }
 
@@ -11515,6 +11707,41 @@ label.custom-control-label {
   text-align: center;
 }
 
+.nav-divider {
+  margin-left: 0.5rem;
+  padding-left: 0.5rem;
+  position: relative;
+}
+.nav-divider::before {
+  background-color: #6c757d;
+  content: "";
+  display: block;
+  height: 1rem;
+  left: 0;
+  margin-top: -0.5rem;
+  position: absolute;
+  top: 50%;
+  width: 1px;
+  z-index: 2;
+}
+.nav-divider-end {
+  margin-right: 0.5rem;
+  padding-right: 0.5rem;
+  position: relative;
+}
+.nav-divider-end::after {
+  background-color: #6c757d;
+  content: "";
+  display: block;
+  height: 1rem;
+  margin-top: -0.5rem;
+  position: absolute;
+  right: 0;
+  top: 50%;
+  width: 1px;
+  z-index: 2;
+}
+
 .nav-text-truncate {
   display: inline-block;
   margin-bottom: -6px;
@@ -11528,13 +11755,6 @@ label.custom-control-label {
   max-width: calc(100% - 24px);
 }
 
-.nav-form {
-  padding-bottom: 0.5rem;
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-  padding-top: 0.5rem;
-}
-
 .nav .nav-form {
   padding-bottom: 0;
   padding-left: 1rem;
@@ -11546,17 +11766,15 @@ label.custom-control-label {
   flex: 1 1 auto;
   text-align: center;
 }
-
+.nav-justified .nav-link {
+  text-align: center;
+  width: 100%;
+}
 .nav-justified .nav-item {
   flex-basis: 0;
   flex-grow: 1;
   text-align: center;
 }
-.nav-justified button.nav-link {
-  text-align: center;
-  width: 100%;
-}
-
 .nav-stacked {
   display: block;
 }
@@ -11570,18 +11788,35 @@ label.custom-control-label {
 .nav-unstyled {
   flex-wrap: nowrap;
 }
-.nav-unstyled .nav-btn {
-  margin: 0 4px;
-  padding: 0 4px;
-}
 .nav-unstyled .nav-link {
   line-height: 2rem;
-  padding: 0 4px;
+  padding-bottom: 0;
+  padding-left: 4px;
+  padding-right: 4px;
+  padding-top: 0;
+}
+.nav-unstyled .nav-link > .c-inner {
+  margin-bottom: 0;
+  margin-left: -4px;
+  margin-right: -4px;
+  margin-top: 0;
 }
 .nav-unstyled .nav-link-monospaced {
   margin: 0 4px;
 }
-
+.nav-unstyled .nav-btn {
+  margin: 0 4px;
+  padding-bottom: 0;
+  padding-left: 4px;
+  padding-right: 4px;
+  padding-top: 0;
+}
+.nav-unstyled .nav-btn .c-inner {
+  margin-bottom: 0;
+  margin-left: -4px;
+  margin-right: -4px;
+  margin-top: 0;
+}
 .nav-nested {
   flex-direction: column;
   flex-wrap: nowrap;
@@ -11688,9 +11923,6 @@ label.custom-control-label {
 .nav-tabs {
   border-bottom: 0.0625rem solid #dee2e6;
 }
-.nav-tabs .nav-item {
-  margin-bottom: -0.0625rem;
-}
 .nav-tabs .nav-link {
   border-color: transparent;
   border-style: solid;
@@ -11711,8 +11943,8 @@ label.custom-control-label {
 }
 .nav-tabs .nav-link.active {
   background-color: #fff;
-  border-color: #dee2e6 #dee2e6 #fff;
   color: #495057;
+  border-color: #dee2e6 #dee2e6 #fff;
 }
 .nav-tabs .nav-link:disabled, .nav-tabs .nav-link.disabled {
   background-color: transparent;
@@ -11721,13 +11953,11 @@ label.custom-control-label {
 }
 .nav-tabs .nav-link[aria-expanded=true], .nav-tabs .nav-link.show {
   background-color: #fff;
-  border-color: #dee2e6 #dee2e6 #fff;
   color: #495057;
-}
-.nav-tabs .nav-item.show .nav-link {
-  background-color: #fff;
   border-color: #dee2e6 #dee2e6 #fff;
-  color: #495057;
+}
+.nav-tabs .nav-item {
+  margin-bottom: -0.0625rem;
 }
 .nav-tabs .dropdown-menu {
   border-top-left-radius: 0;
@@ -11773,11 +12003,12 @@ label.custom-control-label {
   right: 0.5rem;
   width: auto;
 }
-.nav-underline .nav-item .nav-link.active:after {
+.nav-underline .nav-link.active::after {
   background-color: #007bff;
+  content: "";
+  height: 0.1875rem;
 }
-.nav-underline .nav-link.active:after,
-.nav-underline .nav-item.show .nav-link:after {
+.nav-underline .nav-link[aria-expanded=true]::after, .nav-underline .nav-link.show::after {
   content: "";
   height: 0.1875rem;
 }