/* FAQ Library — navy search hero (search + autocomplete + topic tabs) and the
 * topic-grouped accordion list with a source citation under each answer.
 * Brand tokens: navy #06013d, accent blue #1f5d9f, body #424242. */

/* ============================== HERO ============================== */
.lt-faqs-hero {
  background: #06013d;
  color: #fff;
  text-align: center;
  padding: 28px 24px 36px;
  margin: 0;
}
.lt-faqs-hero__inner { 
  margin: 0 auto; 
}
.lt-faqs-hero__headline {
  color: #fff;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.12;
  margin: 0 0 12px;
}
.lt-faqs-hero__subhead {
  color: #b8c2de;
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.55;
  margin: 0 auto 26px;
  max-width: 620px;
}

/* ---- search ---- */
.lt-faqs-hero__searchwrap { position: relative; max-width: 720px; margin: 0 auto; text-align: left; }
.lt-faqs-hero__search {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border-radius: 10px;
  padding: 0 18px;
  height: 60px;
  box-shadow: 0 18px 40px rgba(2, 6, 30, .28);
}
.lt-faqs-hero__search-icon { display: inline-flex; align-items: center; color: #8a93ad; flex: none; }
.lt-faqs-hero__search-input {
  flex: 1 1 auto;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 17px;
  color: #1b1f2a;
  height: 100%;
  font-family: inherit;
}
.lt-faqs-hero__search-input::placeholder { color: #9aa1b4; }
.lt-faqs-hero__search-input::-webkit-search-cancel-button { display: none; }
.lt-faqs-hero__search-clear {
  border: 0; background: transparent; cursor: pointer;
  font-size: 26px; line-height: 1; color: #9aa1b4; padding: 0 2px; flex: none;
}
.lt-faqs-hero__search-clear:hover { color: #424242; }

/* ---- autocomplete dropdown ---- */
.lt-faqs-hero__suggest {
  position: absolute;
  top: calc(100% + 8px);
  left: 0; right: 0;
  z-index: 60;
  margin: 0; padding: 6px;
  list-style: none;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 24px 50px rgba(2, 6, 30, .30);
  max-height: 380px;
  overflow-y: auto;
}
.lt-faqs-hero__suggest-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 11px 14px;
  border-radius: 7px;
  cursor: pointer;
}
.lt-faqs-hero__suggest-item:hover,
.lt-faqs-hero__suggest-item.is-active { background: #f1f4fa; }
.lt-faqs-hero__suggest-q { color: #1b1f2a; font-size: 15px; line-height: 1.35; }
.lt-faqs-hero__suggest-q mark { background: transparent; color: #1f5d9f; font-weight: 700; padding: 0; }
.lt-faqs-hero__suggest-topic {
  flex: none;
  font-size: 11px; font-weight: 600; letter-spacing: .3px;
  color: #6a73a0;
  background: #eef2f8; border-radius: 999px; padding: 3px 9px; white-space: nowrap;
}

/* ---- topic tabs ---- */
.lt-faqs-hero__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
}
.lt-faqs-hero__tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .04);
  color: #d6ddee;
  font-size: 13.5px;
  font-weight: 600;
  padding: 8px 15px;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
  white-space: nowrap;
}
.lt-faqs-hero__tab:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.lt-faqs-hero__tab.is-active { background: #fff; color: #06013d; border-color: #fff; }
.lt-faqs-hero__tab-count {
  font-size: 11px; font-weight: 700;
  background: rgba(255, 255, 255, .16); color: inherit;
  border-radius: 999px; padding: 1px 7px;
}
.lt-faqs-hero__tab.is-active .lt-faqs-hero__tab-count { background: #eef2f8; color: #06013d; }

/* ============================== LIST ============================== */
.lt-faqs { max-width: 860px; margin: 0 auto; }

.lt-faqs__section { margin-bottom: 40px; }
.lt-faqs__section-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
  padding-bottom: 10px;
  border-bottom: 2px solid #06013d;
}
.lt-faqs__section-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: #06013d;
}
.lt-faqs__view-all {
  flex: none;
  font-size: 13px; font-weight: 600;
  color: #1f5d9f; text-decoration: none; white-space: nowrap;
}
.lt-faqs__view-all:hover { text-decoration: underline; }
.lt-faqs__flat-count { font-size: 13px; color: #767c8c; flex: none; }

/* ---- accordion item ---- */
.lt-faq { border-bottom: 1px solid #e6e8ef; }
.lt-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 19px 2px;
  font-family: inherit;
}
.lt-faq__q-text {
  flex: 1 1 auto;
  color: #06013d;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
}
.lt-faq__icon { position: relative; width: 18px; height: 18px; flex: none; }
.lt-faq__icon::before,
.lt-faq__icon::after { content: ""; position: absolute; background: #1f5d9f; border-radius: 2px; }
.lt-faq__icon::before { top: 8px; left: 1px; right: 1px; height: 2px; }
.lt-faq__icon::after { left: 8px; top: 1px; bottom: 1px; width: 2px; transition: opacity .2s ease; }
.lt-faq.is-open .lt-faq__icon::after { opacity: 0; }

.lt-faq__panel { padding: 0 2px 22px; }
.lt-faq__answer { color: #424242; font-size: 15.5px; line-height: 1.72; }
.lt-faq__answer p { margin: 0 0 12px; }
.lt-faq__answer p:last-child { margin-bottom: 0; }
.lt-faq__answer a { color: #1f5d9f; }
/* Inline SKUs / part-numbers in answers arrive as <code>; the theme's global
   code style renders them an alarming red. Re-style as a tidy on-brand token
   (navy on a light-blue chip) so they read as part numbers, not errors. */
.lt-faq__answer code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .9em;
  color: #06013d;
  background: #eef2f8;
  border-radius: 4px;
  padding: 1px 6px;
}

/* ---- source citation (under the answer) ---- */
.lt-faq__cite {
  margin-top: 16px;
  font-size: 13.5px;
  line-height: 1.5;
}
.lt-faq__cite-label { color: #767c8c; margin-right: 4px; }
.lt-faq__cite-link { color: #1f5d9f; font-weight: 600; text-decoration: none; }
.lt-faq__cite-link:hover { text-decoration: underline; }
.lt-faq__cite-sep { color: #b6bcca; margin: 0 7px; }
.lt-faq__cite-arrow { color: #1f5d9f; margin-left: 5px; }

/* ---- empty state ---- */
.lt-faqs__empty { text-align: center; padding: 48px 16px; color: #767c8c; }
.lt-faqs__empty p { margin: 0 0 16px; font-size: 16px; }
.lt-faqs__reset {
  border: 1px solid #d3d7e0; background: #fff; color: #06013d;
  font-weight: 600; font-size: 14px; border-radius: 8px; padding: 10px 18px; cursor: pointer;
}
.lt-faqs__reset:hover { background: #f5f6fa; }

/* ---- load more (flat results paging) ---- */
.lt-faqs__loadmore { text-align: center; margin-top: 28px; }
.lt-faqs__loadmore-btn {
  border: 1px solid #d3d7e0;
  background: #fff;
  color: #06013d;
  font-weight: 600;
  font-size: 14px;
  border-radius: 8px;
  padding: 11px 28px;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.lt-faqs__loadmore-btn:hover { background: #f5f6fa; border-color: #b9c0cf; }
.lt-faqs__loadmore-btn:disabled { opacity: .55; cursor: default; }

/* ============================== RESPONSIVE ============================== */
@media (max-width: 640px) {
  .lt-faqs-hero { padding: 18px 16px 26px; }
  .lt-faqs-hero__search { height: 54px; }
  /* tabs scroll horizontally instead of wrapping into a tall block */
  .lt-faqs-hero__tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-left: -16px; margin-right: -16px;
    padding: 4px 16px 2px;
  }
  .lt-faqs-hero__tabs::-webkit-scrollbar { display: none; }
  .lt-faqs-hero__tab { flex: 0 0 auto; }
  .lt-faq__q-text { font-size: 16px; }
  .lt-faqs__section-header { flex-wrap: wrap; }
}
