/*
 * Hivve LifterLMS theme overrides.
 *
 * Loaded on LifterLMS pages only. Re-skins LifterLMS default chrome with
 * brand tokens defined in style.css. We deliberately keep the LifterLMS
 * stylesheet loaded (it carries layout + structural rules we do not want
 * to re-implement) and layer brand overrides on top.
 *
 * Selectors follow LifterLMS public class conventions (.llms-*). Any rule
 * here that breaks against a LifterLMS update should be the first place
 * to look.
 */

/* ----------------------------------------------------------------------------
 * Academy landing-only primitives (academy-home.php).
 * -------------------------------------------------------------------------- */
.academy-panel {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-panel, 2.6rem);
  background: var(--hivve-navy);
  padding: 1rem;
  box-shadow: var(--shadow-deep, 0 1.5rem 4rem rgba(1, 30, 72, 0.18));
}

.academy-panel::after {
  content: "";
  position: absolute;
  right: 1.25rem;
  bottom: 1.25rem;
  width: 9.5rem;
  height: 9.5rem;
  opacity: 0.18;
  background-image: radial-gradient(circle, #ffffff 0.13rem, transparent 0.15rem);
  background-size: 0.9rem 0.9rem;
  clip-path: polygon(24% 0, 77% 0, 100% 31%, 86% 83%, 47% 100%, 6% 79%, 0 27%);
  pointer-events: none;
}

.academy-surface {
  position: relative;
  z-index: 1;
  border-radius: 1.1rem;
  background: #ffffff;
  padding: 1.35rem;
}

.academy-tile {
  border-radius: var(--radius-card, 0.5rem);
  padding: 1.25rem;
}

.progress-rail {
  height: 0.55rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--hivve-line, #dce8f8);
}

.progress-rail span {
  display: block;
  width: 72%;
  height: 100%;
  border-radius: inherit;
  background: var(--hivve-azure);
}

.lesson-list {
  display: grid;
  gap: 0.7rem;
}

.lesson-item {
  border: 1px solid var(--hivve-soft-line, #e7eef9);
  border-radius: var(--radius-card, 0.5rem);
  background: #ffffff;
}

.lesson-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 999px;
  color: #ffffff;
  background: var(--hivve-cobalt);
  flex-shrink: 0;
}

.course-card {
  position: relative;
  overflow: hidden;
}

.course-card::before {
  content: attr(data-number);
  position: absolute;
  top: 1rem;
  right: 1.25rem;
  color: rgba(0, 71, 171, 0.09);
  font-family: var(--hivve-font-display);
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
}

.course-card > * {
  position: relative;
  z-index: 1;
}

.course-list {
  padding-left: 1.1rem;
}

.course-list li + li {
  margin-top: 0.55rem;
}

.image-panel {
  min-height: 28rem;
  overflow: hidden;
  border-radius: var(--radius-card, 0.5rem);
  color: #ffffff;
  background:
    linear-gradient(90deg, rgba(1, 30, 72, 0.82) 0%, rgba(1, 30, 72, 0.28) 60%, rgba(1, 30, 72, 0.16) 100%),
    var(--hivve-image-panel, var(--hivve-navy)) center / cover no-repeat;
}

.cert-badge {
  width: 7rem;
  height: 7rem;
  object-fit: contain;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
}

@media (max-width: 575.98px) {
  .academy-panel {
    border-radius: 1.4rem;
    padding: 0.7rem;
  }

  .academy-surface {
    padding: 1rem;
  }

  .image-panel {
    min-height: 22rem;
  }
}

/* ----------------------------------------------------------------------------
 * Page wrapping (used by lifterlms/archive-course.php override).
 * -------------------------------------------------------------------------- */
.hivve-lms-page {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.hivve-lms-page__header {
  margin-bottom: 2.5rem;
}

.hivve-lms-page__header .section-label {
  margin-bottom: 0.75rem;
}

.hivve-lms-page__title {
  font-family: var(--hivve-font-display);
  color: var(--hivve-midnight);
  font-weight: 700;
  letter-spacing: 0;
  margin-bottom: 0;
}

/* ----------------------------------------------------------------------------
 * Catalogue grid + course cards.
 * -------------------------------------------------------------------------- */
.llms-loop-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.llms-loop-item {
  margin: 0;
  padding: 0;
  list-style: none;
}

.llms-loop-item-content {
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 0;
  border-radius: var(--radius-card, 0.5rem);
  background: #ffffff;
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
  overflow: hidden;
  transition: transform 220ms ease, box-shadow 220ms ease;
}

.llms-loop-item-content:hover {
  transform: translateY(-0.2rem);
  box-shadow: 0 1.4rem 4rem rgba(1, 30, 72, 0.16);
}

.llms-loop-item-content .llms-featured-image {
  display: block;
  margin: 0;
  border-radius: 0;
  background: var(--hivve-clear-water);
}

.llms-loop-item-content .llms-featured-image img {
  width: 100%;
  height: 11rem;
  object-fit: cover;
  display: block;
}

.llms-loop-item-content .llms-loop-title {
  font-family: var(--hivve-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--hivve-midnight);
  text-decoration: none;
  margin: 1.25rem 1.25rem 0.5rem;
}

.llms-loop-item-content .llms-loop-title:hover,
.llms-loop-item-content .llms-loop-title:focus {
  color: var(--hivve-azure);
}

.llms-loop-item-content .llms-meta-info,
.llms-loop-item-content .llms-meta {
  margin: 0 1.25rem 1rem;
  color: var(--hivve-text-muted, #5f6775);
  font-size: 0.92rem;
}

.llms-loop-item-content .llms-loop-link {
  margin-top: auto;
  padding: 0 1.25rem 1.25rem;
}

/* ----------------------------------------------------------------------------
 * Progress + status indicators.
 * -------------------------------------------------------------------------- */
.llms-progress {
  background: var(--hivve-clear-water);
  border-radius: 999px;
  height: 0.6rem;
  overflow: hidden;
}

.llms-progress .progress-bar-complete,
.llms-progress .llms-progress-bar {
  background: linear-gradient(90deg, var(--hivve-azure) 0%, var(--hivve-cobalt) 100%);
  height: 100%;
  border-radius: 999px;
  transition: width 0.4s ease;
}

.llms-progress .progress-bar-complete {
  background: var(--hivve-cobalt);
}

.llms-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.llms-status.enrolled,
.llms-status.completed {
  background: rgba(0, 71, 171, 0.1);
  color: var(--hivve-cobalt);
}

.llms-status.expired,
.llms-status.cancelled {
  background: rgba(241, 198, 17, 0.16);
  color: var(--hivve-midnight);
}

/* ----------------------------------------------------------------------------
 * Buttons - map LifterLMS classes onto our brand button tokens.
 * -------------------------------------------------------------------------- */
.llms-button-action,
.llms-button-primary,
.button.llms-button-action {
  background: var(--hivve-navy) !important;
  border-color: var(--hivve-navy) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.35rem !important;
  font-weight: 750 !important;
  box-shadow: 0 0.9rem 2.2rem rgba(1, 49, 117, 0.22);
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.llms-button-action:hover,
.llms-button-action:focus,
.llms-button-primary:hover,
.llms-button-primary:focus {
  background: var(--hivve-midnight) !important;
  border-color: var(--hivve-midnight) !important;
  color: #ffffff !important;
}

.llms-button-secondary {
  background: #ffffff !important;
  border: 1px solid #cbdcf5 !important;
  color: var(--hivve-navy) !important;
  border-radius: 999px !important;
  padding: 0.85rem 1.35rem !important;
  font-weight: 750 !important;
}

.llms-button-secondary:hover,
.llms-button-secondary:focus {
  background: var(--hivve-clear-water) !important;
  border-color: var(--hivve-azure) !important;
  color: var(--hivve-navy) !important;
}

.llms-button-danger {
  background: var(--hivve-yellow) !important;
  border-color: var(--hivve-yellow) !important;
  color: var(--hivve-midnight) !important;
}

/* ----------------------------------------------------------------------------
 * Forms (registration, dashboard edit, quiz).
 * -------------------------------------------------------------------------- */
.llms-form-fields input[type="text"],
.llms-form-fields input[type="email"],
.llms-form-fields input[type="password"],
.llms-form-fields input[type="number"],
.llms-form-fields input[type="tel"],
.llms-form-fields input[type="url"],
.llms-form-fields select,
.llms-form-fields textarea,
.llms-quiz input[type="text"],
.llms-quiz textarea {
  display: block;
  width: 100%;
  padding: 0.75rem 1rem;
  font-family: var(--hivve-font-body);
  font-size: 1rem;
  color: var(--hivve-text);
  background: #ffffff;
  border: 1px solid #cbdcf5;
  border-radius: 0.5rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.llms-form-fields input:focus,
.llms-form-fields select:focus,
.llms-form-fields textarea:focus,
.llms-quiz input:focus,
.llms-quiz textarea:focus {
  border-color: var(--hivve-azure);
  outline: 2px solid var(--hivve-azure);
  outline-offset: 1px;
  box-shadow: 0 0 0 0.25rem rgba(189, 216, 248, 0.55);
}

.llms-form-field label {
  font-weight: 600;
  color: var(--hivve-midnight);
  margin-bottom: 0.4rem;
}

.llms-form-field-required::after {
  color: var(--hivve-yellow);
  content: " *";
}

/* ----------------------------------------------------------------------------
 * Notices, errors, messages.
 * -------------------------------------------------------------------------- */
.llms-notice,
.llms-success {
  background: rgba(0, 71, 171, 0.08);
  border-left: 4px solid var(--hivve-cobalt);
  border-radius: var(--radius-card, 0.5rem);
  color: var(--hivve-midnight);
  padding: 1rem 1.25rem;
  margin: 0 0 1.5rem;
}

.llms-error {
  background: rgba(241, 198, 17, 0.16);
  border-left: 4px solid var(--hivve-yellow);
  border-radius: var(--radius-card, 0.5rem);
  color: var(--hivve-midnight);
  padding: 1rem 1.25rem;
  margin: 0 0 1.5rem;
}

/* ----------------------------------------------------------------------------
 * Single course / lesson page.
 * -------------------------------------------------------------------------- */
.hivve-lms-single {
  padding-top: 4rem;
  padding-bottom: 5rem;
}

.hivve-lms-single__header {
  margin-bottom: 2rem;
}

.hivve-lms-single__title {
  font-family: var(--hivve-font-display);
  color: var(--hivve-midnight);
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 2.75rem);
  margin: 0 0 1rem;
}

.hivve-lms-single__lede {
  font-size: 1.1rem;
  line-height: 1.7;
  color: var(--hivve-text);
  margin-bottom: 2rem;
}

.llms-syllabus-wrapper,
.llms-syllabus {
  border-radius: var(--radius-card, 0.5rem);
  background: #ffffff;
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
  padding: 1.5rem;
  margin: 2rem 0;
}

.llms-syllabus-wrapper h3,
.llms-syllabus h3,
.llms-section-title {
  font-family: var(--hivve-font-display);
  color: var(--hivve-midnight);
  font-size: 1.25rem;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 1rem;
}

.llms-lesson-preview {
  border: 1px solid var(--hivve-soft-line, #e7eef9);
  border-radius: var(--radius-card, 0.5rem);
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
  background: #ffffff;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.llms-lesson-preview:hover {
  border-color: var(--hivve-azure);
  transform: translateX(0.2rem);
}

.llms-lesson-preview .llms-lesson-title,
.llms-lesson-preview .llms-lesson-link {
  color: var(--hivve-midnight);
  text-decoration: none;
  font-weight: 600;
}

.llms-lesson-preview .llms-lesson-title:hover,
.llms-lesson-preview .llms-lesson-link:hover {
  color: var(--hivve-azure);
}

.llms-lesson-complete {
  color: var(--hivve-cobalt);
}

/* ----------------------------------------------------------------------------
 * Student dashboard.
 * -------------------------------------------------------------------------- */
.llms-student-dashboard,
.llms-myaccount {
  padding-top: 3rem;
  padding-bottom: 5rem;
}

.llms-myaccount-navigation {
  background: #ffffff;
  border-radius: var(--radius-card, 0.5rem);
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
  padding: 1rem 0;
  margin-bottom: 2rem;
  list-style: none;
}

.llms-myaccount-navigation li {
  margin: 0;
}

.llms-myaccount-navigation a {
  display: block;
  padding: 0.75rem 1.25rem;
  color: var(--hivve-text);
  text-decoration: none;
  border-left: 3px solid transparent;
  font-weight: 600;
}

.llms-myaccount-navigation li.is-active a,
.llms-myaccount-navigation a:hover,
.llms-myaccount-navigation a:focus {
  border-left-color: var(--hivve-azure);
  color: var(--hivve-azure);
  background: var(--hivve-clear-water);
}

.llms-sd-tile,
.llms-student-dashboard .llms-sd-section {
  background: #ffffff;
  border-radius: var(--radius-card, 0.5rem);
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

/* ----------------------------------------------------------------------------
 * Quiz UI.
 * -------------------------------------------------------------------------- */
.llms-quiz-wrapper {
  background: #ffffff;
  border-radius: var(--radius-card, 0.5rem);
  box-shadow: var(--shadow-soft, 0 1rem 3rem rgba(1, 30, 72, 0.11));
  padding: 2rem;
}

.llms-quiz-question {
  border: 1px solid var(--hivve-soft-line, #e7eef9);
  border-radius: var(--radius-card, 0.5rem);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  background: #ffffff;
}

.llms-quiz-question .llms-question-text {
  font-family: var(--hivve-font-display);
  color: var(--hivve-midnight);
  font-size: 1.15rem;
  font-weight: 700;
}

.llms-quiz-question.llms-quiz-correct {
  border-color: var(--hivve-cobalt);
  background: rgba(0, 71, 171, 0.06);
}

.llms-quiz-question.llms-quiz-incorrect {
  border-color: var(--hivve-yellow);
  background: rgba(241, 198, 17, 0.08);
}

.llms-quiz-results .llms-quiz-meta-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
}

.llms-quiz-results .llms-quiz-meta-info > div {
  background: var(--hivve-clear-water);
  border-radius: var(--radius-card, 0.5rem);
  padding: 1rem;
  text-align: center;
}

.llms-quiz-results .llms-quiz-meta-info strong {
  display: block;
  font-family: var(--hivve-font-display);
  color: var(--hivve-navy);
  font-size: 1.5rem;
  font-weight: 700;
}

/* ----------------------------------------------------------------------------
 * Certificates.
 * -------------------------------------------------------------------------- */
.llms-certificate-container {
  background: #ffffff;
  border: 0.5rem solid var(--hivve-azure);
  border-radius: var(--radius-card, 0.5rem);
  padding: 3rem;
  box-shadow: 0 1.5rem 4rem rgba(1, 30, 72, 0.18);
  position: relative;
}

.llms-certificate-container::before {
  content: "";
  position: absolute;
  top: 1rem;
  right: 1rem;
  bottom: 1rem;
  left: 1rem;
  border: 1px solid var(--hivve-soft-line, #e7eef9);
  border-radius: 0.25rem;
  pointer-events: none;
}

.llms-certificate-title {
  font-family: var(--hivve-font-display);
  color: var(--hivve-midnight);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  text-align: center;
}

/* ----------------------------------------------------------------------------
 * Empty catalogue / no-courses state.
 * -------------------------------------------------------------------------- */
.llms-courses-no-results,
.hivve-lms-empty {
  text-align: center;
  padding: 3rem 1.5rem;
  background: var(--hivve-clear-water);
  border-radius: var(--radius-card, 0.5rem);
  color: var(--hivve-midnight);
}

.llms-courses-no-results h2,
.hivve-lms-empty h2 {
  font-family: var(--hivve-font-display);
  font-weight: 700;
  margin-bottom: 0.5rem;
}

/* ----------------------------------------------------------------------------
 * Pagination.
 * -------------------------------------------------------------------------- */
.llms-pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin: 2rem 0 0;
  list-style: none;
  padding: 0;
}

.llms-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--hivve-soft-line, #e7eef9);
  background: #ffffff;
  color: var(--hivve-text);
  text-decoration: none;
  font-weight: 600;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.llms-pagination .page-numbers.current,
.llms-pagination .page-numbers:hover,
.llms-pagination .page-numbers:focus {
  background: var(--hivve-navy);
  border-color: var(--hivve-navy);
  color: #ffffff;
}