/* https://itchief.ru/javascript/tabs */
.tab {
  display: flex;
  flex-direction: column;
}

.tab-nav > input[type="radio"] {
  display: none;
}

.tab-content {
  display: none;
}

#content-1:has(~ .tab-nav > #tab-btn-1:checked),
#content-2:has(~ .tab-nav > #tab-btn-2:checked),
#content-3:has(~ .tab-nav > #tab-btn-3:checked) {
  display: block;
}

.tab-nav {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #dee2e6;
  margin-bottom: 1rem;
  order: -1;
}

.tab-nav > label {
  display: block;
  padding: 0.5rem 1rem;
  color: #0d6efd; /*#0cb399*/
  text-decoration: none;
  background: 0 0;
  border: 1px solid transparent;
  margin-bottom: -1px;
  border-top-left-radius: 0.375rem;
  border-top-right-radius: 0.375rem;
  -webkit-appearance: button;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
  cursor: pointer;
}

.tab-nav > input[type="radio"]:checked + label {
  color: #000;
  background-color: #fff;
  border-color: #dee2e6 #dee2e6 #fff;
  cursor: default;
}