.fs-level-finder-results { margin-top: 16px; }
.fs-lf-intro { padding: 14px 16px; border: 1px solid #e5e5e5; border-radius: 12px; margin-bottom: 14px; background: #fff; }
.fs-lf-recommend { margin: 0 0 8px; }
.fs-lf-message, .fs-lf-desc { margin-top: 10px; }
.fs-lf-none { padding: 12px 16px; border: 1px dashed #ccc; border-radius: 12px; }

/* -------------- Results wrapper -------------- */
.fs-results-wrap{
  width: min(1100px, 94vw);
  margin: 18px auto 0;
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
}

.toggle-heading {
  margin: 28px 0 10px;
  font-size: 1.4rem;
  font-weight: 700;
}

/* -------------- Table base -------------- */
.fs-lessons-table {
  width: 100%;
  border-collapse: collapse;
}

.fs-lessons-table th,
.fs-lessons-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e9ecef;
  vertical-align: middle;
  text-align: left;            /* <-- key */
  word-break: break-word;
}

.fs-lessons-table thead th {
  font-weight: 600;
  color: #0f172a;
  text-align: left !important; /* <-- in case theme centers TH */
}
#fsLevelFinderResults.is-hidden {
  display: none;
}
/* ---------- Term accordion toggles ---------- */
.toggle-heading{
  margin: 18px 0 10px;
}

.fs-term-toggle{
  all: unset;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
}

.fs-term-toggle:focus{
  outline: 2px solid rgba(15,23,42,.35);
  outline-offset: 4px;
  border-radius: 10px;
}

.fs-term-toggle__icon{
  width: 28px;
  height: 28px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  display: inline-block;
  position: relative;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.fs-term-toggle__icon::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid #0f172a;
  border-bottom: 2px solid #0f172a;
  transform: translate(-50%,-55%) rotate(45deg);
  transition: transform .18s ease;
}

/* collapsed state */
.fs-term-toggle[aria-expanded="false"] .fs-term-toggle__icon::before{
  transform: translate(-50%,-45%) rotate(-45deg);
}


/* Start all term panels collapsed */
.fs-term-panel {
  display: none;
}
.fs-term-panel.is-open {
  display: block;
}

/* ---------- Make Level Finder results typography smaller on mobile ---------- */
@media (max-width: 768px) {

  /* 1) Reduce the overall base size inside the results area */
  #fsLevelFinderResults,
  .fs-results-wrap{
    font-size: clamp(13px, 3.6vw, 15px); /* phones feel less “shouty” */
    line-height: 1.45;
  }

  /* Ensure common text elements inherit the smaller base */
  #fsLevelFinderResults p,
  #fsLevelFinderResults li,
  #fsLevelFinderResults td,
  #fsLevelFinderResults th{
    font-size: 1em;
  }

  /* 2) Your toggle headings are big (rem-based) — dial them back on mobile */
  .toggle-heading{
    font-size: 1.1rem;
    margin: 16px 0 8px;
  }
    .fs-lessons-table td[data-label="Dates"],
  .fs-lessons-table td[data-label="Book"] {
    justify-content: flex-end;   /* <-- right */
    gap: 10px;
  }

  /* keep the label on the left, value on the right */
  .fs-lessons-table td[data-label="Dates"]::before,
  .fs-lessons-table td[data-label="Book"]::before {
    margin-right: auto;          /* pushes the button/link to the right */
  }
 /* Make action buttons smaller + not full-width */
  .fs-lessons-table td[data-label="Dates"] .button,
  .fs-lessons-table td[data-label="Book"] .button,
  .fs-lessons-table td[data-label="Book"] a.button {
    font-size: 0.9rem;
    padding: 8px 12px;
    line-height: 1.1;
    border-radius: 10px;
    width: auto !important;        /* stops “block / 100% width” theme styles */
    min-width: 0;
    max-width: 75%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }

  /* If your theme adds big shadows to buttons, reduce them */
  .fs-lessons-table td[data-label="Dates"] .button,
  .fs-lessons-table td[data-label="Book"] .button {
    box-shadow: none;
  }

  /* “Sold out” label smaller + more subtle */
  .fs-lessons-table td[data-label="Book"] .label {
    font-size: 0.85rem;
    padding: 6px 10px;
    border-radius: 999px;
    display: inline-block;
  }
  .fs-term-toggle{
    font-size: 1.05rem;
    line-height: 1.2;
  }

  /* 3) Optional: tighten the intro card a bit */
  .fs-lf-intro{
    padding: 12px 14px;
  }

  .fs-lf-message,
  .fs-lf-desc{
    margin-top: 6px;
  }

  /* 4) Optional: table “cards” spacing a touch smaller */
  .fs-lessons-table td{
    padding: 6px 6px;
  }
  .fs-lessons-table td::before{
    font-size: 0.95em;
  }

  /* 5) Optional: slightly smaller toggle icon */
  .fs-term-toggle__icon{
    width: 20px;
    height: 20px;
  }
  .fs-term-toggle__icon::before{
    width: 7px;
    height: 7px;
  }
}