.ts-kursfinder-wizard {
  max-width: 100%;
  margin: 25px 0 30px;
}

.ts-kf-box {
  background: #f2f2f2;
  border-radius: 5px;
  padding: 10px;
}

.ts-kf-start,
.ts-kf-steparea,
.ts-kf-result-card {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
}

.ts-kf-start,
.ts-kf-steparea,
.ts-kf-result-head {
  padding: 20px;
}

.ts-kf-start h2,
.ts-kf-questionbox h3,
.ts-kf-result-title,
.ts-kf-course-title {
  margin-top: 0;
}

.ts-kf-start p,
.ts-kf-result-text,
.ts-kf-course-text,
.ts-kf-course-meta,
.ts-kf-note details {
  line-height: 1.65;
}

.ts-kf-progressline {
  margin-bottom: 18px;
}

.ts-kf-progressline span {
  display: block;
  margin-bottom: 8px;
  font-weight: 700;
}

.ts-kf-progressbar {
  height: 7px;
  background: #e8e8e8;
  border-radius: 99px;
  overflow: hidden;
}

.ts-kf-progressbar div {
  height: 100%;
  width: 0;
  background: #c3512f;
  transition: width .25s ease;
}

.ts-kf-questionbox {
  background: #fafafa;
  border: 1px solid #e3e3e3;
  border-left: 4px solid #6a6d13;
  border-radius: 5px;
  padding: 18px;
}

.ts-kf-options {
  display: grid;
  gap: 10px;
}

.ts-kf-option {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #ddd;
  border-left: 3px solid transparent;
  border-radius: 5px;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease;
}

.ts-kf-option:hover {
  background: #f7f7f7;
  border-left-color: #c3512f;
}

.ts-kf-option.is-selected {
  background: #fff7f4;
  border-color: #d9b2a5;
  border-left-color: #c3512f;
}

.ts-kf-option input {
  margin-top: 3px;
  accent-color: #c3512f;
}

.ts-kf-option span {
  line-height: 1.45;
}

.ts-kf-nav {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-top: 18px;
}

.ts-kf-btn,
.ts-kf-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 5px;
  font-family: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease, opacity .18s ease;
}

.ts-kf-btn-main {
  background: #2f7f45;
  border: 1px solid #2f7f45;
  color: #fff;
}

.ts-kf-btn-main:hover {
  background: #276d3a;
  border-color: #276d3a;
  color: #fff;
}

.ts-kf-btn-ghost,
.ts-kf-link-secondary {
  background: #fff;
  border: 1px solid #ccc;
  color: inherit;
}

.ts-kf-btn-ghost:hover,
.ts-kf-link-secondary:hover {
  background: #f5f5f5;
  border-color: #aaa;
  color: inherit;
  text-decoration: none;
}

.ts-kf-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.ts-kf-result {
  padding: 0;
  margin-top: 10px;
}

.ts-kf-result-card {
  overflow: hidden;
  border-left: 4px solid #c3512f;
}

.ts-kf-result-label {
  display: block;
  margin-bottom: 7px;
  color: #c3512f;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.ts-kf-result-title {
  margin-bottom: 10px;
}

.ts-kf-result-text {
  margin-bottom: 0;
}

.ts-kf-course-list {
  border-top: 1px solid #eeeeee;
  padding: 14px 20px 18px;
  background: #fff;
}

.ts-kf-course-item {
  background: #fafafa;
  border: 1px solid #e3e3e3;
  border-radius: 5px;
  padding: 18px;
  margin: 0 0 12px;
}

.ts-kf-course-item:last-child {
  margin-bottom: 0;
}

.ts-kf-course-title {
  margin-bottom: 6px;
}

.ts-kf-course-title a {
  color: inherit;
  text-decoration: none;
}

.ts-kf-course-title a:hover {
  text-decoration: underline;
}

.ts-kf-course-meta {
  margin: 0 0 8px;
  color: #555;
}

.ts-kf-course-text {
  margin: 0 0 12px;
}

.ts-kf-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}

.ts-kf-badge-row .ts-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 5px 9px;
  border-radius: 5px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  border: 0;
}

.ts-kf-badge-row .ts-badge svg {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
}

.ts-kf-badge-row .ts-duration {
  background: #3d879f;
  color: #fff;
}

.ts-kf-badge-row .ts-price {
  background: #c35a5a;
  color: #fff;
}

.ts-kf-badge-row .ts-offer {
  background: #2f7f45;
  color: #fff;
}

.ts-kf-badge-row .ts-offer:hover {
  background: #276d3a;
}

.ts-kf-badge-row .ts-offer a,
.ts-kf-badge-row .ts-offer a:hover {
  color: #fff;
  text-decoration: none;
}

.ts-kf-result-tools {
  padding: 12px 20px 16px;
  border-top: 1px solid #eeeeee;
  background: #fff;
}

.ts-kf-result-tools button {
  background: transparent;
  border: 0;
  padding: 0;
  color: #777;
  font-family: inherit;
  font-weight: 700;
  cursor: pointer;
}

.ts-kf-result-tools button:hover {
  color: #c3512f;
}

.ts-kf-note {
  border-top: 1px solid #eeeeee;
  background: #fff;
}

.ts-kf-note details {
  padding: 13px 20px;
}

.ts-kf-note summary {
  cursor: pointer;
  font-weight: 700;
}

.ts-kf-note ul {
  margin: 10px 0 0 20px;
  padding: 0;
}

@media (min-width: 760px) {
  .ts-kf-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .ts-kf-box {
    padding: 8px;
  }

  .ts-kf-start,
  .ts-kf-steparea,
  .ts-kf-questionbox,
  .ts-kf-result-head {
    padding: 16px;
  }

  .ts-kf-course-list {
    padding: 12px;
  }

  .ts-kf-course-item {
    padding: 14px;
  }

  .ts-kf-nav {
    flex-direction: column;
  }

  .ts-kf-btn {
    width: 100%;
  }

  .ts-kf-badge-row .ts-badge {
    min-height: 32px;
  }
}


.ts-kf-course-meta a {
  color: inherit;
  font-weight: 700;
  text-decoration: none;
}

.ts-kf-course-meta a:hover {
  color: #c3512f;
  text-decoration: underline;
}
