#lead-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(11, 35, 82, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}

#lead-popup-overlay .lp-card {
  background: #fff;
  border-radius: 16px;
  padding: 32px 28px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  font-family: inherit;
}

#lead-popup-overlay h2 {
  margin: 0 0 10px;
  color: #0b2352;
  font-size: 22px;
}

#lead-popup-overlay p {
  margin: 0 0 20px;
  color: #5b6b8c;
  font-size: 14px;
  line-height: 1.5;
}

#lead-popup-overlay label {
  display: block;
  font-weight: 600;
  color: #123a7a;
  font-size: 13px;
  margin: 14px 0 6px;
}

#lead-popup-overlay input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1px solid #c7d2e6;
  border-radius: 8px;
  font-size: 15px;
}

#lead-popup-overlay input:focus {
  outline: none;
  border-color: #123a7a;
}

#lead-popup-overlay button#lp-submit {
  width: 100%;
  margin-top: 22px;
  padding: 13px 16px;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

#lead-popup-overlay button#lp-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

#lead-popup-overlay .lp-error {
  margin-top: 12px;
  color: #b42318;
  font-size: 13px;
}

/* ---------- Floating batches launcher ---------- */
#lp-batches-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9998;
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 10px 30px rgba(11, 35, 82, 0.35);
  cursor: pointer;
}

/* ---------- Batches panel ---------- */
#lp-batches-overlay {
  position: fixed;
  inset: 0;
  background: rgba(11, 35, 82, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}

#lp-batches-overlay .lp-panel {
  background: #fff;
  border-radius: 16px;
  max-width: 640px;
  width: 100%;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.lp-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid #e6ebf5;
  position: sticky;
  top: 0;
  background: #fff;
}

.lp-panel-header h2 {
  margin: 0;
  color: #0b2352;
  font-size: 20px;
}

.lp-panel-header button {
  background: none;
  border: none;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  color: #5b6b8c;
}

#lp-panel-body {
  padding: 20px 24px;
}

.lp-loading {
  color: #5b6b8c;
  font-size: 14px;
}

/* ---------- "Upcoming Batches" page: widened, de-boxed container ---------- */
.lp-upcoming-container {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  text-align: left !important;
}

.lp-empty-note {
  background: #fff;
  border: 1px solid #e6ebf5;
  border-radius: 14px;
  padding: 34px 24px;
  text-align: center;
  color: #5b6b8c;
  font-size: 14px;
}

.lp-batch-meta {
  margin: 0 0 4px;
  color: #5b6b8c;
  font-size: 12.5px;
}

.lp-batch-card {
  position: relative;
  background: #fff;
  border: 1px solid #e6ebf5;
  border-radius: 14px;
  padding: 20px 20px 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100%;
  box-shadow: 0 2px 10px -6px rgba(11, 35, 82, 0.12);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.lp-batch-card:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: 14px 14px 0 0;
}

.lp-card-ongoing:before { background: linear-gradient(90deg, #15803d, #4ade80); }
.lp-card-upcoming:before { background: linear-gradient(90deg, #1d4ed8, #7fb0f5); }

.lp-batch-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px -14px rgba(11, 35, 82, 0.28);
  border-color: #c7d2e6;
}

.lp-batch-card-top { margin-bottom: 16px; }

/* MahaRERA logo in the card's top-right corner */
.lp-batch-logo {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 52px;
  height: 52px;
  object-fit: contain;
  pointer-events: none;
}
/* keep the title and code/date pills clear of the logo */
.lp-batch-card h3,
.lp-batch-card .lp-batch-meta-row { padding-right: 62px; }

.lp-batch-card h3 {
  margin: 6px 0 8px;
  color: #0b2352;
  font-size: 17px;
  font-weight: 700;
}

.lp-batch-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-bottom: 10px;
}
.lp-batch-meta-row span {
  font-size: 12px;
  color: #47597a;
  background: #f3f6fb;
  border-radius: 100px;
  padding: 4px 10px;
  white-space: nowrap;
}
.lp-batch-code {
  font-weight: 700;
  color: #1d4ed8 !important;
  background: #e8f0fe !important;
}

.lp-batch-desc {
  margin: 0;
  color: #5b6b8c;
  font-size: 13px;
  line-height: 1.55;
}

.lp-batch-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px dashed #e6ebf5;
}

.lp-price {
  font-weight: 800;
  color: #0b2352;
  font-size: 19px;
}

.lp-buy-btn {
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
  border: none;
  border-radius: 9px;
  padding: 10px 20px;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.05s ease;
}
.lp-buy-btn:hover { opacity: 0.92; }
.lp-buy-btn:active { transform: scale(0.98); }

/* ---------- Buy form + payment result screens reuse #lead-popup-overlay's .lp-card ---------- */
#lp-buy-overlay,
#lp-result-overlay,
#lp-info-overlay,
#lp-confirm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(11, 35, 82, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}

#lp-buy-overlay .lp-card,
#lp-result-overlay .lp-card,
#lp-info-overlay .lp-card,
#lp-confirm-overlay .lp-card {
  background: #fff;
  border-radius: 16px;
  padding: 32px 28px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  font-family: inherit;
  text-align: center;
}

#lp-buy-overlay .lp-card { text-align: left; }
#lp-buy-overlay h2, #lp-result-overlay h2, #lp-info-overlay h2, #lp-confirm-overlay h2 { margin: 0 0 10px; color: #0b2352; font-size: 20px; }
#lp-buy-overlay p, #lp-result-overlay p, #lp-info-overlay p, #lp-confirm-overlay p { margin: 0 0 14px; color: #5b6b8c; font-size: 14px; line-height: 1.5; }
#lp-buy-overlay label { display: block; font-weight: 600; color: #123a7a; font-size: 13px; margin: 14px 0 6px; }
#lp-buy-overlay input {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  border: 1px solid #c7d2e6; border-radius: 8px; font-size: 15px;
}
#lp-buy-overlay button#lp-buy-submit {
  width: 100%; margin-top: 22px; padding: 13px 16px; border: none; border-radius: 8px;
  background: linear-gradient(135deg, #1d4ed8, #0b2352); color: #fff;
  font-size: 15px; font-weight: 600; cursor: pointer;
}
.lp-secondary-btn {
  width: 100%; margin-top: 10px; padding: 12px 16px; border: 1px solid #c7d2e6;
  border-radius: 8px; background: #fff; color: #5b6b8c; font-size: 14px; cursor: pointer;
}
#lp-result-overlay button#lp-result-continue,
#lp-info-overlay button#lp-info-continue {
  padding: 13px 24px; border: none; border-radius: 8px;
  background: linear-gradient(135deg, #1d4ed8, #0b2352); color: #fff;
  font-size: 15px; font-weight: 600; cursor: pointer;
}

.lp-badge {
  display: inline-block;
  font-size: 10.5px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  vertical-align: middle;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.lp-badge-upcoming { background: #e0ecff; color: #1d4ed8; }
.lp-badge-ongoing { background: #dcfce7; color: #15803d; }

.lp-section { margin-bottom: 32px; }
.lp-section-title { margin-bottom: 16px; }
.lp-section-title .lp-badge {
  font-size: 13px;
  padding: 7px 16px;
  letter-spacing: 0.5px;
}
.lp-batch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
}

@media (max-width: 760px) {
  .lp-batch-grid { grid-template-columns: 1fr; }
}

/* ---------- Admission Counsellor footer button + panel ---------- */
.lp-counsellor-nav-btn {
  width: 100%;
  border: none;
  cursor: pointer;
  font-family: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 11px 14px;
  margin-top: auto;
  border-radius: 10px;
  background: linear-gradient(135deg, #1d4ed8, #071733);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  transition: opacity 0.15s ease, transform 0.05s ease;
}
.lp-counsellor-nav-btn:hover { opacity: 0.92; }
.lp-counsellor-nav-btn:active { transform: scale(0.98); }
/* ---------- Support & Help page: counsellor tile + FAQ accordion ---------- */
/* Native support tiles: size columns to their content instead of forcing
   equal widths, so the longer email tile gets the extra room it needs
   instead of wrapping its text. */
.support-tiles {
  grid-template-columns: repeat(auto-fit, minmax(220px, max-content));
}
.support-tile h4,
.support-tile p {
  white-space: nowrap;
}

.lp-support-tile-btn {
  border: none;
  cursor: pointer;
  font-family: inherit;
  width: 100%;
  text-align: left;
  background: linear-gradient(135deg, #1d4ed8, #071733) !important;
}
.lp-support-tile-btn:hover { box-shadow: 0 10px 24px -12px rgba(11, 35, 82, 0.5) !important; }
.lp-support-tile-btn > div { min-width: 0; }
.lp-support-tile-btn h4 { color: #fff !important; }
.lp-support-tile-btn p { color: #cddcff !important; }
.lp-support-tile-btn h4,
.lp-support-tile-btn p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lp-support-tile-icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  line-height: 1;
}

.lp-faq-section {
  margin-top: 32px;
  max-width: 720px;
}
.lp-faq-heading {
  font-size: 13px;
  font-weight: 700;
  color: #123a7a;
  margin: 0 0 13px;
}
.lp-faq-item {
  background: #fff;
  border: 1px solid #e2ecfc;
  border-radius: 12px;
  margin-bottom: 10px;
  overflow: hidden;
}
.lp-faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 18px;
  border: none;
  background: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  font-size: 13.8px;
  font-weight: 600;
  color: #0b2352;
}
.lp-faq-caret {
  flex-shrink: 0;
  color: #8ea0bf;
  transition: transform 0.15s ease;
  font-size: 13px;
}
.lp-faq-open .lp-faq-caret { transform: rotate(180deg); color: #1d4ed8; }
.lp-faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease;
}
.lp-faq-answer p {
  margin: 0;
  padding: 0 18px 16px;
  font-size: 13px;
  color: #5b6b8c;
  line-height: 1.6;
}

.lp-sidebar-icon {
  font-size: 15px;
  width: 18px;
  display: inline-flex;
  justify-content: center;
  flex-shrink: 0;
}

#lp-counsellor-overlay {
  position: fixed;
  inset: 0;
  background: rgba(11, 35, 82, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}
#lp-counsellor-overlay .lp-panel {
  background: #fff;
  border-radius: 16px;
  max-width: 380px;
  width: 100%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
#lp-counsellor-body {
  padding: 24px 24px 28px;
}
.lp-counsellor-card {
  text-align: center;
  padding: 4px 2px 0;
}
.lp-counsellor-avatar-img {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 2px solid #e6ebf5;
}
.lp-counsellor-avatar {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 700;
}
.lp-counsellor-name {
  font-size: 18px;
  font-weight: 700;
  color: #0b2352;
  margin-bottom: 2px;
}
.lp-counsellor-role {
  font-size: 12.5px;
  color: #8ea0bf;
  margin: 0 0 20px;
}
.lp-counsellor-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-bottom: 18px;
}
.lp-counsellor-actions a {
  flex: 1;
  max-width: 150px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 11px 14px;
  border-radius: 9px;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  transition: opacity 0.15s ease, transform 0.05s ease;
}
.lp-counsellor-actions a:hover { opacity: 0.9; }
.lp-counsellor-actions a:active { transform: scale(0.98); }
.lp-counsellor-call-btn {
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
}
.lp-counsellor-whatsapp-btn {
  background: linear-gradient(135deg, #25d366, #128c4a);
  color: #fff;
}
.lp-counsellor-email {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f3f6fb;
  border-radius: 100px;
  padding: 6px 14px;
  font-size: 12.5px;
  color: #47597a;
  margin: 0;
}

.lp-date-pill-label {
  font-size: 10.5px;
  font-weight: 700;
  color: #8ea0bf;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 4px;
  width: 100%;
}

.lp-batch-meta {
  display: flex;
  flex-direction: column;
  margin: 2px 0 6px;
  background: linear-gradient(180deg, #ffffff, var(--ice-100, #eef4ff));
  border: 1px solid var(--ice-200, #e2ecfc);
  border-radius: 14px;
  box-shadow: 0 10px 24px -18px rgba(7, 23, 51, 0.45);
  overflow: hidden;
}
.lp-meta-cell {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
}
.lp-meta-cell + .lp-meta-cell {
  border-top: 1px solid var(--ice-200, #e2ecfc);
}
.lp-meta-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  background: linear-gradient(135deg, var(--blue-700, #1e56b8), var(--navy-900, #0b2352));
  box-shadow: 0 4px 10px -4px rgba(11, 35, 82, 0.55);
}
.lp-meta-icon-gold {
  background: linear-gradient(135deg, var(--gold-400, #e0b95c), var(--gold-500, #c99a3a));
  box-shadow: 0 4px 10px -4px rgba(201, 154, 58, 0.55);
}
.lp-meta-text {
  min-width: 0;
}
.lp-meta-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: #8ea0bf;
  margin-bottom: 2px;
}
.lp-meta-value {
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--navy-950, #071733);
  white-space: nowrap;
}

.lp-view-details-btn {
  margin-top: 10px;
  padding: 9px 16px;
  border: 1.5px solid #1d4ed8;
  border-radius: 8px;
  background: #fff;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.lp-view-details-btn:hover { background: #eef4ff; }

/* ---------- Batch detail modal ---------- */
#lp-detail-overlay {
  position: fixed;
  inset: 0;
  background: #f4f7fd;
  z-index: 9999;
  overflow-y: auto;
}
#lp-detail-overlay .lp-panel {
  max-width: none;
  width: 100%;
  margin: 0;
  min-height: 100vh;
  box-shadow: none;
  border-radius: 0;
}
#lp-detail-overlay .lp-panel-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: linear-gradient(120deg, #071733, #0b2352, #123a7a);
  padding: 22px 5vw;
  display: flex;
  align-items: center;
  gap: 20px;
}
#lp-detail-overlay .lp-panel-header h2 {
  color: #fff;
  margin: 0;
  font-size: 22px;
  flex: 1;
}
#lp-detail-overlay .lp-back-btn {
  color: #cddcff;
  font-size: 14px;
}
#lp-detail-overlay .lp-back-btn:hover { color: #fff; }
#lp-detail-body { padding: 32px 5vw 80px; max-width: 1100px; margin: 0 auto; }

/* ---------- QR attendance scanner ---------- */
#lp-qr-overlay {
  position: fixed;
  inset: 0;
  background: #f4f7fd;
  z-index: 10000;
  overflow-y: auto;
}
#lp-qr-overlay .lp-panel {
  max-width: none;
  width: 100%;
  margin: 0;
  min-height: 100vh;
  box-shadow: none;
  border-radius: 0;
}
#lp-qr-overlay .lp-panel-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: linear-gradient(120deg, #071733, #0b2352, #123a7a);
  padding: 22px 5vw;
  display: flex;
  align-items: center;
  gap: 20px;
}
#lp-qr-overlay .lp-panel-header h2 { color: #fff; margin: 0; font-size: 20px; flex: 1; }
#lp-qr-overlay .lp-back-btn { color: #cddcff; font-size: 14px; }
#lp-qr-overlay .lp-back-btn:hover { color: #fff; }
.lp-qr-body { padding: 28px 5vw 60px; max-width: 480px; margin: 0 auto; text-align: center; }
.lp-qr-video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 18px;
}
#lp-qr-video { width: 100%; height: 100%; object-fit: cover; }
.lp-qr-frame {
  position: absolute;
  inset: 12%;
  border: 3px solid rgba(255, 255, 255, 0.85);
  border-radius: 18px;
  box-shadow: 0 0 0 999px rgba(0, 0, 0, 0.25);
  pointer-events: none;
}
.lp-qr-status { font-size: 13.5px; color: #47597a; font-weight: 600; }
.lp-qr-result {
  font-size: 15px;
  font-weight: 700;
  padding: 16px;
  border-radius: 12px;
  margin-bottom: 16px;
}
.lp-qr-success { background: #e4f7e9; color: #1e7b34; }
.lp-qr-error { background: #fdecec; color: #b3261e; }

.lp-stats-row { display: flex; gap: 14px; margin-bottom: 20px; }
.lp-stat-box {
  flex: 1;
  background: #f5f8ff;
  border-radius: 12px;
  padding: 16px;
  text-align: center;
}
.lp-stat-num { font-size: 28px; font-weight: 800; color: #0b2352; }
.lp-stat-label { font-size: 12px; color: #5b6b8c; margin-top: 2px; }

.lp-schedule-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 8px;
}
.lp-schedule-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid #eef2f9;
  background: #fff;
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: 0 6px 18px -14px rgba(11, 35, 82, 0.3);
}
.lp-schedule-card-date { display: flex; flex-direction: column; }
.lp-schedule-weekday { font-size: 11px; font-weight: 700; color: #8ea0bf; text-transform: uppercase; letter-spacing: 0.4px; }
.lp-schedule-datenum { font-size: 14.5px; font-weight: 700; color: #0b2352; }
.lp-schedule-card-time { font-size: 13px; color: #5b6b8c; }
.lp-schedule-card-topic { font-size: 12.5px; color: #47597a; }
.lp-schedule-card-actions {
  margin-top: auto;
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.lp-schedule-card-actions a,
.lp-schedule-card-actions button {
  width: 100%;
  justify-content: center;
  text-align: center;
}

.lp-schedule-join-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #dc2626, #991b1b);
  color: #fff;
  text-decoration: none;
  padding: 9px 18px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 700;
  animation: lp-pulse-glow 2s ease-in-out infinite;
}
@keyframes lp-pulse-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4); }
  50% { box-shadow: 0 0 0 6px rgba(220, 38, 38, 0); }
}
.lp-attendance-hint {
  font-size: 11.5px;
  color: #8ea0bf;
  margin: 0;
}
.lp-mark-attendance-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #15803d, #14532d);
  color: #fff;
  border: none;
  padding: 9px 14px;
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
}
.lp-mark-attendance-btn:disabled {
  background: #f3f6fb;
  color: #c1cbe0;
  cursor: not-allowed;
}
.lp-recording-video {
  width: 100%;
  border-radius: 10px;
  background: #000;
}

.lp-schedule-recording-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #1d4ed8, #0b2352);
  color: #fff;
  text-decoration: none;
  padding: 9px 18px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 700;
}
.lp-schedule-locked-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f3f6fb;
  color: #8ea0bf;
  border: 1px solid #e2ecfc;
  padding: 9px 14px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 600;
  cursor: not-allowed;
}
.lp-schedule-past { opacity: 0.85; }
.lp-schedule-live { border-color: #fecaca; background: #fff8f8; }

.lp-back-btn {
  background: none;
  border: none;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 0;
}

/* ---------- Attendance hero ---------- */
.lp-attendance-hero {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-bottom: 24px;
  flex-wrap: wrap;
  background: #fff;
  border-radius: 20px;
  padding: 28px 32px;
  box-shadow: 0 12px 36px -20px rgba(11, 35, 82, 0.35);
}
.lp-attendance-ring {
  --pct: 0;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  flex-shrink: 0;
  background: conic-gradient(#1d4ed8 calc(var(--pct) * 1%), #e6ebf5 0);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px -10px rgba(29, 78, 216, 0.45);
}
.lp-attendance-ring-inner {
  width: 108px;
  height: 108px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.lp-attendance-ring-inner span { font-size: 28px; font-weight: 800; color: #0b2352; }
.lp-attendance-ring-inner small { font-size: 11px; color: #5b6b8c; text-transform: uppercase; letter-spacing: 0.5px; margin-top: 2px; }
.lp-attendance-hero .lp-stats-row { margin-bottom: 0; min-width: 260px; gap: 18px; }

.lp-attendance-progress-wrap {
  flex: 1 1 100%;
  margin-top: 10px;
}
.lp-attendance-progress-track {
  position: relative;
  height: 14px;
  border-radius: 999px;
  background: #e6ebf5;
  overflow: visible;
}
.lp-attendance-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #f97316);
  box-shadow: 0 2px 8px -2px rgba(249, 115, 22, 0.55);
  transition: width 0.5s ease, background 0.3s ease;
}
.lp-attendance-progress-fill.lp-qualified {
  background: linear-gradient(90deg, #34d399, #16a34a);
  box-shadow: 0 2px 8px -2px rgba(22, 163, 74, 0.55);
}
.lp-attendance-progress-threshold {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: #0b2352;
  opacity: 0.4;
}
.lp-attendance-progress-threshold-label {
  position: absolute;
  top: -19px;
  left: 0;
  transform: translateX(-50%);
  font-size: 10px;
  font-weight: 700;
  color: #5b6b8c;
  white-space: nowrap;
}
.lp-attendance-progress-caption {
  margin-top: 12px;
  font-size: 12.5px;
  color: #5b6b8c;
  font-weight: 600;
}
.lp-attendance-progress-caption.lp-qualified-text {
  color: #15803d;
  font-weight: 700;
}

.lp-stat-box {
  flex: 1;
  background: linear-gradient(150deg, #eef4ff, #f7faff);
  border: 1px solid #e2eaff;
  border-radius: 16px;
  padding: 22px 16px;
  text-align: center;
}
.lp-stat-num { font-size: 34px; font-weight: 800; color: #0b2352; line-height: 1; }
.lp-stat-label { font-size: 12.5px; color: #5b6b8c; margin-top: 6px; font-weight: 600; }

.lp-schedule-info {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 26px;
}
.lp-info-chip {
  background: #fff;
  border: 1px solid #e0e9fb;
  box-shadow: 0 4px 14px -10px rgba(11, 35, 82, 0.3);
  border-radius: 999px;
  padding: 9px 18px;
  font-size: 13px;
  color: #123a7a;
  font-weight: 600;
  text-decoration: none;
}

/* MahaRERA logo swapped in for the generic book icon on the batch card */
.stat-card-icon.lp-maharera-icon {
  width: 52px;
  height: 52px;
  background: #fff;
  border: 1px solid #e2ecfc;
  border-radius: 50%;
  padding: 0;
  box-shadow: 0 2px 6px -2px rgba(7, 23, 51, 0.15);
}
.stat-card-icon.lp-maharera-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
}

/* ---------- Mobile responsiveness ---------- */
@media (max-width: 760px) {
  .lp-stats-row { flex-wrap: wrap; }
  .lp-stat-box { min-width: 130px; }
  .support-tiles { grid-template-columns: 1fr; }
  .support-tile h4, .support-tile p { white-space: normal; }
  .lp-schedule-grid { grid-template-columns: 1fr; }
  .lp-attendance-hero { padding: 20px; gap: 20px; }
  .lp-attendance-ring { width: 110px; height: 110px; }
  .lp-attendance-ring-inner { width: 84px; height: 84px; }
  .lp-attendance-ring-inner span { font-size: 24px; }
  .lp-attendance-hero .lp-stats-row { min-width: 0; width: 100%; }
  .lp-counsellor-actions { flex-direction: column; }
  .lp-counsellor-actions a { max-width: none; }
  .lp-batch-card-footer { flex-wrap: wrap; }
  .lp-batch-logo { width: 44px; height: 44px; top: 16px; right: 16px; }
  .lp-batch-card h3,
  .lp-batch-card .lp-batch-meta-row { padding-right: 52px; }
  .lp-meta-cell { padding: 11px 14px; }
  #lead-popup-overlay .lp-card,
  #lp-buy-overlay .lp-card,
  #lp-result-overlay .lp-card,
  #lp-info-overlay .lp-card { padding: 26px 20px; }
  #lp-detail-overlay .lp-panel-header,
  #lp-qr-overlay .lp-panel-header { padding: 18px 20px; gap: 14px; }
  #lp-detail-overlay .lp-panel-header h2 { font-size: 18px; }
  #lp-detail-body { padding: 22px 20px 60px; }
  .lp-qr-body { padding: 22px 20px 40px; }
  .lp-panel-header { padding: 16px 18px; }
  #lp-panel-body { padding: 16px 18px; }
  .lp-faq-section { max-width: 100%; }
}

/* ---------- Mobile nav drawer (toggle button injected by lead-popup.js) ---------- */
.lp-nav-toggle { display: none; }
.lp-nav-close { display: none; }
.lp-nav-backdrop { display: none; }

@media (max-width: 760px) {
  .lp-nav-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    margin-left: auto;
    border: none;
    background: none;
    font-size: 20px;
    color: #123a7a;
    cursor: pointer;
  }

  .sidebar-nav {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100vh !important;
    width: 78vw;
    max-width: 300px;
    background: #fff;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 20px 14px 90px !important;
    gap: 4px !important;
    box-shadow: 10px 0 40px -12px rgba(7, 23, 51, 0.35);
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    z-index: 10001;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }
  .sidebar-nav.lp-nav-open { transform: translateX(0); }
  .sidebar-link { white-space: normal !important; }

  .lp-nav-close {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    width: 34px;
    height: 34px;
    margin-bottom: 8px;
    border: none;
    background: var(--ice-100, #eef4ff);
    border-radius: 9px;
    font-size: 15px;
    color: #123a7a;
    cursor: pointer;
  }

  /* Log out moves off the header bar into the bottom of the same slide-out
     drawer as the nav links, instead of sitting in the top row. */
  .sidebar-footer {
    position: fixed !important;
    left: 0;
    bottom: 0;
    top: auto !important;
    width: 78vw;
    max-width: 300px;
    background: #fff;
    border-top: 1px solid var(--ice-200, #e2ecfc) !important;
    border-left: none !important;
    padding: 14px !important;
    box-shadow: 0 -8px 24px -18px rgba(7, 23, 51, 0.35);
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    z-index: 10002;
  }
  .sidebar-footer.lp-nav-open { transform: translateX(0); }

  .lp-nav-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(7, 23, 51, 0.45);
    z-index: 10000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }
  .lp-nav-backdrop.lp-nav-open {
    opacity: 1;
    pointer-events: auto;
  }
}

/* ---------- Unlocked resources (Study Material + RERA Kavach GPT) ---------- */
.lp-unlocked-section { margin-top: 28px; }
.lp-unlock-icon {
  flex-shrink: 0;
  width: 22px;
  text-align: center;
  font-size: 20px;
  line-height: 1;
}

/* ---------- "Launching soon" interest pages (Digital Marketing / Rent Agreement) ---------- */
.lp-soon {
  max-width: 560px;
  background: #fff;
  border: 1px solid #e6ebf5;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 28px -16px rgba(7, 23, 51, 0.28);
}
.lp-soon-hero {
  position: relative;
  padding: 28px 28px 24px;
  background: linear-gradient(135deg, #0b2352 0%, #1d4ed8 100%);
  color: #fff;
}
.lp-soon-badge {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 100px;
  padding: 5px 12px;
}
.lp-soon-icon {
  position: absolute;
  top: 22px;
  right: 24px;
  font-size: 40px;
  line-height: 1;
}
.lp-soon-hero h2 {
  margin: 16px 0 6px;
  padding-right: 56px;
  font-family: var(--font-display, Georgia, serif);
  font-size: 22px;
  line-height: 1.25;
}
.lp-soon-hero p { margin: 0; font-size: 14px; line-height: 1.55; color: rgba(255, 255, 255, 0.85); }
.lp-soon-body { padding: 24px 28px 28px; }
.lp-soon-body h3 { margin: 0 0 14px; color: #0b2352; font-size: 16px; font-weight: 700; }
.lp-soon-form label {
  display: block;
  margin-bottom: 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: #47597a;
}
.lp-soon-form input {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 11px 14px;
  font: inherit;
  font-size: 15px;
  color: #0b2352;
  border: 1px solid #d5deed;
  border-radius: 10px;
  background: #f8fafd;
  box-sizing: border-box;
}
.lp-soon-form input:focus { outline: none; border-color: #1d4ed8; background: #fff; box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.12); }
.lp-soon .lp-error {
  margin: -4px 0 12px;
  padding: 9px 12px;
  font-size: 13px;
  color: #b3261e;
  background: #fdecea;
  border-radius: 8px;
}
.lp-soon-form button,
.lp-soon-edit {
  width: 100%;
  padding: 12px 18px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #0b2352, #1d4ed8);
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
.lp-soon-form button:disabled { opacity: 0.6; cursor: default; }
.lp-soon-done { text-align: center; }
.lp-soon-check {
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: 700;
  color: #15803d;
  background: #dcfce7;
  border-radius: 50%;
}
.lp-soon-done p { margin: 0 0 18px; font-size: 14px; line-height: 1.55; color: #5b6b8c; }
.lp-soon-edit { width: auto; color: #1d4ed8; background: #e8f0fe; }

@media (max-width: 640px) {
  .lp-soon-hero, .lp-soon-body { padding-left: 20px; padding-right: 20px; }
  .lp-soon-hero h2 { font-size: 19px; }
  .lp-soon-icon { font-size: 32px; }
}

/* ---------- Support & Help section shown at the bottom of My Profile ---------- */
.lp-profile-support {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid #e6ebf5;
}
.lp-profile-support .page-title { font-size: 24px; }

/* ---------- Quizzes & Short Notes: practice cards ---------- */
.lp-practice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 36px;
  max-width: 1000px;
}
.lp-practice-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 26px 26px 24px;
  border-radius: 18px;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 14px 34px -18px rgba(7, 23, 51, 0.55);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.lp-practice-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px -18px rgba(7, 23, 51, 0.6);
}
.lp-pc-quiz { background: linear-gradient(140deg, #0b2352 0%, #1d4ed8 100%); }
.lp-pc-exam { background: linear-gradient(140deg, #3b0d11 0%, #b3261e 100%); }
.lp-pc-glow {
  position: absolute;
  z-index: -1;
  top: -70px;
  right: -70px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 70%);
}
.lp-pc-exam .lp-pc-glow {
  background: url("/maharera-logo.png") center / 120px no-repeat;
  opacity: 0.14;
  top: -20px;
  right: -20px;
  width: 170px;
  height: 170px;
}
.lp-pc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.lp-pc-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.lp-pc-icon svg { width: 24px; height: 24px; }
.lp-pc-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  padding: 5px 11px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.22);
}
.lp-practice-card h3 {
  margin: 0 0 6px;
  font-family: var(--font-display, Georgia, serif);
  font-size: 22px;
  line-height: 1.25;
}
.lp-practice-card p {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.82);
}
.lp-pc-points {
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.lp-pc-points li {
  font-size: 12.5px;
  padding: 5px 11px 5px 26px;
  border-radius: 100px;
  background: rgba(0, 0, 0, 0.18);
  position: relative;
}
.lp-pc-points li:before {
  content: "✓";
  position: absolute;
  left: 10px;
  font-weight: 700;
  color: #86efac;
}
.lp-pc-cta {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 10px;
  background: #fff;
  font-size: 14.5px;
  font-weight: 700;
}
.lp-pc-quiz .lp-pc-cta { color: #0b2352; }
.lp-pc-exam .lp-pc-cta { color: #8a1c15; }
.lp-pc-arrow { transition: transform 0.18s ease; }
.lp-practice-card:hover .lp-pc-arrow { transform: translateX(4px); }

.lp-notes-heading {
  margin: 0 0 14px;
  font-family: var(--font-display, Georgia, serif);
  font-size: 20px;
  color: #0b2352;
}

@media (max-width: 760px) {
  .lp-practice-grid { grid-template-columns: 1fr; gap: 16px; margin-bottom: 28px; }
  .lp-practice-card { padding: 22px 20px 20px; }
  .lp-practice-card h3 { font-size: 20px; }
}

/* ======================================================================
   Moved out of inline styles in lead-popup.js (so dark mode can restyle)
   ====================================================================== */
.lp-schedule-heading { margin: 28px 0 16px; font-size: 15px; color: #0b2352; font-weight: 800; }
.lp-badge-missed { background: #f1f5f9; color: #64748b; }

/* ======================================================================
   Dark mode toggle (injected into .sidebar-footer by lead-popup.js)
   ====================================================================== */
.lp-theme-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 10px 9px 12px;
  margin: 0 0 12px;
  border: 1px solid var(--ice-200, #e2ecfc);
  border-radius: 9px;
  background: #fff;
  color: #47597a;
  font-family: var(--font-body, inherit);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s ease;
}
.lp-theme-toggle:hover { background: var(--ice-100, #eef4ff); }
.lp-theme-icon { display: flex; flex-shrink: 0; }
.lp-theme-label { flex: 1; text-align: left; }
.lp-theme-switch {
  position: relative;
  flex-shrink: 0;
  width: 34px;
  height: 20px;
  border-radius: 999px;
  background: #cfd9ea;
  transition: background 0.2s ease;
}
.lp-theme-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease;
}
.lp-theme-toggle[aria-checked="true"] .lp-theme-switch { background: #2f74e0; }
.lp-theme-toggle[aria-checked="true"] .lp-theme-knob { transform: translateX(14px); }

@media (max-width: 760px) {
  /* Drawer footer now holds the toggle + Log out, stacked */
  .sidebar-footer {
    flex-direction: column;
    align-items: stretch !important;
    gap: 10px;
  }
  .lp-theme-toggle { margin: 0; }
  .sidebar-nav { padding-bottom: 140px !important; }
}

/* Smooth colour change only while switching themes */
html.rg-theme-anim *,
html.rg-theme-anim *::before,
html.rg-theme-anim *::after {
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}

/* ======================================================================
   DARK MODE — everything below applies only when <html class="rg-dark">
   Palette: page #0b1220 · surface #121a2b · raised #18233a
            border #223049 · text #e6ecf7 · muted #9aa8c4 · faint #7f91b3
   ====================================================================== */
html.rg-dark { color-scheme: dark; }
html.rg-dark body,
html.rg-dark .app-shell { background: #0b1220; color: #e6ecf7; }

/* --- Sidebar --- */
html.rg-dark .app-sidebar,
html.rg-dark .sidebar-nav,
html.rg-dark .sidebar-footer { background: #111a2c; }
html.rg-dark .app-sidebar { border-right-color: #223049; }
html.rg-dark .sidebar-brand { border-bottom-color: #223049; border-right-color: #223049; }
html.rg-dark .sidebar-footer { border-top-color: #223049 !important; border-left-color: #223049; }
html.rg-dark .sidebar-brand-name,
html.rg-dark .sidebar-user-name { color: #e6ecf7; }
html.rg-dark .sidebar-brand-eyebrow,
html.rg-dark .sidebar-user-mobile { color: #7f91b3; }
html.rg-dark .sidebar-link { color: #a9b7d2; }
html.rg-dark .sidebar-link:hover { background: #18233a; color: #e6ecf7; }
html.rg-dark .sidebar-link.active { background: #1a2a4a; color: #8fbaf7; }
html.rg-dark .sidebar-logout { background: #111a2c; border-color: #223049; color: #a9b7d2; }
html.rg-dark .sidebar-logout:hover { background: #3a1a1d; border-color: #6b2a2e; color: #ff9b93; }
html.rg-dark .sidebar-nav::-webkit-scrollbar-thumb { background: #2a3a57; }
html.rg-dark .lp-nav-toggle { color: #b8c8e6; }
html.rg-dark .lp-nav-close { background: #18233a; color: #b8c8e6; }
html.rg-dark .lp-theme-toggle { background: #111a2c; border-color: #223049; color: #a9b7d2; }
html.rg-dark .lp-theme-toggle:hover { background: #18233a; }

/* --- Page text --- */
html.rg-dark .page-eyebrow { color: #7fb0f5; }
html.rg-dark .page-title,
html.rg-dark .auth-title,
html.rg-dark .stat-card h3,
html.rg-dark .list-row-details h4,
html.rg-dark .payment-main h4,
html.rg-dark .payment-amount,
html.rg-dark .support-tile { color: #e6ecf7; }
html.rg-dark .page-subtitle,
html.rg-dark .auth-subtitle,
html.rg-dark .channel-note,
html.rg-dark .list-row-details p,
html.rg-dark .support-tile p,
html.rg-dark .empty-state,
html.rg-dark .loading-note { color: #9aa8c4; }
html.rg-dark .section-label,
html.rg-dark .field-label { color: #b8c8e6; }
html.rg-dark .muted-line,
html.rg-dark .cert-pending { color: #7f91b3; }
html.rg-dark .link-btn,
html.rg-dark .payment-links a,
html.rg-dark .list-row-arrow,
html.rg-dark .support-tile svg { color: #8fbaf7; }

/* --- Cards / panels --- */
html.rg-dark .auth-card,
html.rg-dark .stat-card,
html.rg-dark .list-panel,
html.rg-dark .support-tile,
html.rg-dark .profile-card,
html.rg-dark .empty-state { background: #121a2b; border-color: #223049; }
html.rg-dark .support-tile:hover { border-color: #3b5a8f; box-shadow: 0 8px 20px -12px rgba(0, 0, 0, 0.6); }
html.rg-dark .list-row,
html.rg-dark .payment-row { border-bottom-color: #223049; }
html.rg-dark .payment-links { border-top-color: #223049; }
html.rg-dark a.list-row:hover { background: #18233a; }
html.rg-dark .pill { background: #1a2a4a; color: #b8c8e6; }
html.rg-dark .announcement-card { background: #221d10; border-color: #4a3d1a; }
html.rg-dark .announcement-card h4 { color: #f3e7c4; }
html.rg-dark .announcement-card p { color: #d9c998; }
html.rg-dark .announcement-date { color: #b8a567; }

/* --- Status colours --- */
html.rg-dark .status-paid,
html.rg-dark .flash-success { background: #133222; color: #6fdc8c; }
html.rg-dark .status-approved { background: #16294a; color: #8fbaf7; }
html.rg-dark .status-pending { background: #33260e; color: #f0b85a; }
html.rg-dark .status-rejected,
html.rg-dark .form-error { background: #3a1a1d; color: #ff9b93; }

/* --- Inputs --- */
html.rg-dark .profile-input,
html.rg-dark .otp-box { background: #0e1626; border-color: #2a3a57; color: #e6ecf7; }
html.rg-dark .otp-box:not(:placeholder-shown) { border-color: #4f7fc4; }
html.rg-dark .mobile-input-row { border-color: #2a3a57; background: #0e1626; }
html.rg-dark .mobile-input-row input { background: transparent; color: #e6ecf7; }
html.rg-dark .mobile-prefix { background: #18233a; color: #b8c8e6; border-right-color: #2a3a57; }
html.rg-dark input::placeholder,
html.rg-dark textarea::placeholder { color: #6b7c9c; }

/* --- Popups & panels from lead-popup.js --- */
html.rg-dark #lead-popup-overlay .lp-card,
html.rg-dark #lp-buy-overlay .lp-card,
html.rg-dark #lp-result-overlay .lp-card,
html.rg-dark #lp-info-overlay .lp-card,
html.rg-dark #lp-confirm-overlay .lp-card,
html.rg-dark #lp-batches-overlay .lp-panel,
html.rg-dark #lp-counsellor-overlay .lp-panel { background: #121a2b; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6); }
html.rg-dark #lead-popup-overlay h2,
html.rg-dark #lp-buy-overlay h2,
html.rg-dark #lp-result-overlay h2,
html.rg-dark #lp-info-overlay h2,
html.rg-dark #lp-confirm-overlay h2 { color: #e6ecf7; }
html.rg-dark #lead-popup-overlay p,
html.rg-dark #lp-buy-overlay p,
html.rg-dark #lp-result-overlay p,
html.rg-dark #lp-info-overlay p,
html.rg-dark #lp-confirm-overlay p { color: #9aa8c4; }
html.rg-dark #lead-popup-overlay label,
html.rg-dark #lp-buy-overlay label { color: #b8c8e6; }
html.rg-dark #lead-popup-overlay input,
html.rg-dark #lp-buy-overlay input { background: #0e1626; border-color: #2a3a57; color: #e6ecf7; }
html.rg-dark #lead-popup-overlay input:focus,
html.rg-dark #lp-buy-overlay input:focus { border-color: #4f8ef0; }
html.rg-dark #lead-popup-overlay .lp-error { color: #ff9b93; }
html.rg-dark .lp-secondary-btn { background: #18233a; border-color: #2a3a57; color: #b8c8e6; }

html.rg-dark .lp-panel-header { background: #121a2b; border-bottom-color: #223049; }
html.rg-dark .lp-panel-header h2 { color: #e6ecf7; }
html.rg-dark .lp-panel-header button { color: #9aa8c4; }
html.rg-dark .lp-back-btn { color: #8fbaf7; }

/* Full-screen batch detail + QR scanner (headers keep their navy gradient) */
html.rg-dark #lp-detail-overlay,
html.rg-dark #lp-qr-overlay,
html.rg-dark #lp-detail-overlay .lp-panel,
html.rg-dark #lp-qr-overlay .lp-panel { background: #0b1220; }

/* Cards */
html.rg-dark .lp-empty-note,
html.rg-dark .lp-batch-card,
html.rg-dark .lp-schedule-card,
html.rg-dark .lp-attendance-hero,
html.rg-dark .lp-faq-item,
html.rg-dark .lp-soon,
html.rg-dark .lp-info-chip { background: #121a2b; border-color: #223049; box-shadow: 0 8px 24px -16px rgba(0, 0, 0, 0.6); }
html.rg-dark .lp-batch-card:hover { border-color: #3b5a8f; }
html.rg-dark .lp-batch-card-footer { border-top-color: #223049; }
html.rg-dark .lp-profile-support { border-top-color: #223049; }
html.rg-dark .lp-batch-meta { background: linear-gradient(180deg, #152038, #121a2b); border-color: #223049; box-shadow: none; }
html.rg-dark .lp-meta-cell + .lp-meta-cell { border-top-color: #223049; }
html.rg-dark .lp-stat-box { background: linear-gradient(150deg, #16223a, #121a2b); border-color: #243149; }
html.rg-dark .lp-schedule-live { background: #2a1518; border-color: #6b2a2e; }

/* Headings / primary text */
html.rg-dark .lp-batch-card h3,
html.rg-dark .lp-price,
html.rg-dark .lp-counsellor-name,
html.rg-dark .lp-stat-num,
html.rg-dark .lp-schedule-datenum,
html.rg-dark .lp-schedule-heading,
html.rg-dark .lp-attendance-ring-inner span,
html.rg-dark .lp-faq-question,
html.rg-dark .lp-soon-body h3,
html.rg-dark .lp-notes-heading,
html.rg-dark .lp-meta-value { color: #e6ecf7; }

/* Muted text */
html.rg-dark .lp-loading,
html.rg-dark .lp-batch-desc,
html.rg-dark .lp-stat-label,
html.rg-dark .lp-schedule-card-time,
html.rg-dark .lp-schedule-card-topic,
html.rg-dark .lp-attendance-ring-inner small,
html.rg-dark .lp-attendance-progress-caption,
html.rg-dark .lp-attendance-progress-threshold-label,
html.rg-dark .lp-faq-answer p,
html.rg-dark .lp-soon-done p,
html.rg-dark .lp-qr-status,
html.rg-dark .lp-empty-note { color: #9aa8c4; }
html.rg-dark .lp-counsellor-role,
html.rg-dark .lp-date-pill-label,
html.rg-dark .lp-meta-label,
html.rg-dark .lp-schedule-weekday,
html.rg-dark .lp-attendance-hint,
html.rg-dark .lp-faq-caret { color: #7f91b3; }
html.rg-dark .lp-faq-heading,
html.rg-dark .lp-info-chip { color: #b8c8e6; }
html.rg-dark .lp-faq-open .lp-faq-caret { color: #7fb0f5; }
html.rg-dark .lp-attendance-progress-caption.lp-qualified-text { color: #6fdc8c; }

/* Chips & badges */
html.rg-dark .lp-batch-meta-row span,
html.rg-dark .lp-counsellor-email { background: #18233a; color: #b8c8e6; }
html.rg-dark .lp-batch-code { background: #1a2a4a !important; color: #8fbaf7 !important; }
html.rg-dark .lp-badge-upcoming { background: #16294a; color: #8fbaf7; }
html.rg-dark .lp-badge-ongoing { background: #133222; color: #6fdc8c; }
html.rg-dark .lp-badge-missed { background: #1e2638; color: #8d9ab3; }
html.rg-dark .lp-counsellor-avatar-img { border-color: #223049; }

/* Buttons */
html.rg-dark .lp-view-details-btn { background: transparent; border-color: #4f8ef0; color: #8fbaf7; }
html.rg-dark .lp-view-details-btn:hover { background: #16294a; }
html.rg-dark .lp-mark-attendance-btn:disabled,
html.rg-dark .lp-schedule-locked-btn { background: #18233a; color: #6b7c9c; border-color: #243149; }

/* Attendance ring / progress */
html.rg-dark .lp-attendance-ring { background: conic-gradient(#4f8ef0 calc(var(--pct) * 1%), #243149 0); }
html.rg-dark .lp-attendance-ring-inner { background: #121a2b; }
html.rg-dark .lp-attendance-progress-track { background: #243149; }
html.rg-dark .lp-attendance-progress-threshold { background: #e6ecf7; }

/* QR result messages */
html.rg-dark .lp-qr-success { background: #133222; color: #6fdc8c; }
html.rg-dark .lp-qr-error { background: #3a1a1d; color: #ff9b93; }

/* "Launching soon" interest form */
html.rg-dark .lp-soon-form label { color: #9aa8c4; }
html.rg-dark .lp-soon-form input { background: #0e1626; border-color: #2a3a57; color: #e6ecf7; }
html.rg-dark .lp-soon-form input:focus { background: #0e1626; border-color: #4f8ef0; }
html.rg-dark .lp-soon .lp-error { background: #3a1a1d; color: #ff9b93; }
html.rg-dark .lp-soon-check { background: #133222; color: #6fdc8c; }
html.rg-dark .lp-soon-edit { background: #16294a; color: #8fbaf7; }

/* ======================================================================
   Sidebar section dividers (rendered by the bundle between nav groups)
   ====================================================================== */
.sidebar-divider {
  flex-shrink: 0;
  height: 1px;
  margin: 8px 12px;
  background: var(--ice-200, #e2ecfc);
}
html.rg-dark .sidebar-divider { background: #223049; }

/* Longer labels (e.g. "Short Notes for MahaRERA Exam") wrap neatly to two lines */
.sidebar-link { line-height: 1.3; }
.sidebar-link svg { flex-shrink: 0; }

/* ======================================================================
   Sidebar section label ("Other Trainings") — keeps MahaRERA Training
   visually separate from the other courses
   ====================================================================== */
.sidebar-section-label {
  flex-shrink: 0;
  padding: 4px 12px 4px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a98b3;
}
html.rg-dark .sidebar-section-label { color: #6b7c9c; }

/* ======================================================================
   MahaRERA Training dashboard ("/") — full-width layout, batch hero,
   attendance panel and row-wise class sessions
   ====================================================================== */
.app-content:has(.lp-dash) { max-width: none; }

.lp-dash {
  --d-card: #ffffff;
  --d-border: #e3eaf6;
  --d-text: #0b2352;
  --d-muted: #5b6b8c;
  --d-soft: #f5f8fe;
  --d-track: #e6edf8;
  --d-accent: #1e56b8;
  --d-accent-soft: #eaf1ff;
  --d-shadow: 0 12px 32px -20px rgba(7, 23, 51, 0.35);
}
html.rg-dark .lp-dash {
  --d-card: #111a2c;
  --d-border: #223049;
  --d-text: #e6ecf7;
  --d-muted: #8a98b3;
  --d-soft: #0e1626;
  --d-track: #223049;
  --d-accent: #7fb0f5;
  --d-accent-soft: #16294a;
  --d-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.8);
}

/* ---- Announcements: compact notice rows ---- */
.lp-dash .announcement-list { gap: 10px; margin-bottom: 24px !important; }
.lp-dash .announcement-card,
html.rg-dark .lp-dash .announcement-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "top date" "body body";
  gap: 4px 16px;
  align-items: center;
  background: var(--d-card);
  border: 1px solid var(--d-border);
  border-left: 4px solid var(--gold-500, #c99a3a);
  border-radius: 12px;
  padding: 13px 18px;
  box-shadow: var(--d-shadow);
}
.lp-dash .announcement-card-top { grid-area: top; margin: 0; }
.lp-dash .announcement-card h4,
html.rg-dark .lp-dash .announcement-card h4 { margin: 0; font-size: 14.5px; color: var(--d-text); }
.lp-dash .announcement-card p,
html.rg-dark .lp-dash .announcement-card p { grid-area: body; margin: 0; font-size: 13.5px; color: var(--d-muted); }
.lp-dash .announcement-date,
html.rg-dark .lp-dash .announcement-date {
  grid-area: date;
  font-size: 11px;
  color: var(--d-muted);
  background: var(--d-soft);
  border: 1px solid var(--d-border);
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}

/* ---- Batch hero ---- */
.lp-dash-batch { margin-bottom: 28px; }
.lp-dash-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--d-border);
  background: var(--d-card);
  box-shadow: var(--d-shadow);
}
.lp-dash-hero-main {
  position: relative;
  padding: 26px 28px;
  color: #fff;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(127, 176, 245, 0.28) 0%, rgba(127, 176, 245, 0) 55%),
    linear-gradient(135deg, #071733 0%, #0b2352 45%, #1e56b8 100%);
  display: flex;
  flex-direction: column;
  gap: 22px;
}
html.rg-dark .lp-dash-hero-main {
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(79, 142, 240, 0.22) 0%, rgba(79, 142, 240, 0) 55%),
    linear-gradient(135deg, #060f22 0%, #0b1d40 50%, #163a7c 100%);
}
.lp-dash-id { display: flex; align-items: center; gap: 16px; }
.lp-dash-logo {
  width: 64px; height: 64px; flex-shrink: 0;
  border-radius: 50%;
  background: #fff;
  display: grid; place-items: center;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.14);
}
.lp-dash-logo img { width: 54px; height: 54px; object-fit: contain; border-radius: 50%; }
.lp-dash-id-text { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
.lp-dash-status {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: #a8f0c0;
}
.lp-dash-dot { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.25); }
.lp-dash-title {
  margin: 0;
  font-family: var(--font-display, Georgia, serif);
  font-size: 26px; font-weight: 600; line-height: 1.15;
  color: #fff;
}
.lp-dash-code {
  font-size: 12.5px; font-weight: 600;
  padding: 4px 11px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #e6efff;
}
.lp-dash-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.lp-dash-fact {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 13px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.lp-dash-fact-icon {
  width: 34px; height: 34px; flex-shrink: 0;
  display: grid; place-items: center;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.12);
  color: #e0b95c;
}
.lp-dash-fact-text { display: flex; flex-direction: column; min-width: 0; }
.lp-dash-fact-label { font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: rgba(230, 239, 255, 0.65); }
.lp-dash-fact-value { font-size: 14px; font-weight: 600; color: #fff; }

.lp-dash-next {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px;
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(4, 12, 30, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.lp-dash-next-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lp-dash-next-label { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #e0b95c; }
.lp-dash-next-value { font-size: 15px; font-weight: 600; color: #fff; display: flex; flex-direction: column; gap: 2px; }
.lp-dash-next-sub { font-size: 12px; font-weight: 500; color: rgba(230, 239, 255, 0.7); }
.lp-dash-next-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---- Buttons ---- */
.lp-dash-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 9px 15px;
  border-radius: 10px;
  font-size: 13px; font-weight: 600; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform 0.12s ease, background 0.15s ease, border-color 0.15s ease;
  font-family: inherit;
}
.lp-dash-btn:hover { transform: translateY(-1px); }
.lp-dash-btn-gold { background: linear-gradient(135deg, #e0b95c, #c99a3a); color: #1d1503; }
.lp-dash-btn-glass { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.22); color: #fff; }
.lp-dash-btn-glass:hover { background: rgba(255, 255, 255, 0.18); }
.lp-dash-btn-primary { background: var(--blue-700, #1e56b8); color: #fff; }
.lp-dash-btn-primary:hover { background: #1a4aa0; }
.lp-dash-btn-ghost { background: transparent; border-color: var(--d-border); color: var(--d-accent); }
.lp-dash-btn-ghost:hover { background: var(--d-accent-soft); }
.lp-dash-btn-locked { background: var(--d-soft); border-color: var(--d-border); color: var(--d-muted); cursor: default; font-weight: 500; }
.lp-dash-btn-locked:hover { transform: none; }
.lp-live-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #ef4444;
  box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.6);
  animation: lpLivePulse 1.6s infinite;
}
@keyframes lpLivePulse {
  0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.55); }
  70% { box-shadow: 0 0 0 7px rgba(239, 68, 68, 0); }
  100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}

/* ---- Attendance panel ---- */
.lp-dash-att {
  padding: 24px 22px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  border-left: 1px solid var(--d-border);
  color: var(--d-text);
}
.lp-dash-att-loading { font-size: 13px; color: var(--d-muted); }
.lp-dash-att-title { align-self: stretch; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--d-muted); }
.lp-dash-ring {
  --p: 0;
  --ring: #2f74e0;
  width: 136px; height: 136px; border-radius: 50%;
  background: conic-gradient(var(--ring) calc(var(--p) * 1%), var(--d-track) 0);
  display: grid; place-items: center;
  position: relative;
}
.lp-dash-ring.is-qualified { --ring: #22a356; }
.lp-dash-ring::after { content: ""; position: absolute; inset: 12px; border-radius: 50%; background: var(--d-card); }
.lp-dash-ring > span { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.lp-dash-ring strong { font-size: 30px; font-weight: 700; line-height: 1; color: var(--d-text); }
.lp-dash-ring small { margin-top: 4px; font-size: 11px; color: var(--d-muted); }
.lp-dash-att-caption { font-size: 12.5px; font-weight: 600; color: var(--d-muted); text-align: center; }
.lp-dash-att-caption.is-qualified { color: #15803d; }
html.rg-dark .lp-dash-att-caption.is-qualified { color: #6fdc8c; }
.lp-dash-att-stats {
  align-self: stretch;
  display: grid; grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--d-border); border-radius: 12px; overflow: hidden;
}
.lp-dash-att-stats > div { display: flex; flex-direction: column; align-items: center; padding: 10px 4px; background: var(--d-soft); }
.lp-dash-att-stats > div + div { border-left: 1px solid var(--d-border); }
.lp-dash-att-stats strong { font-size: 17px; color: var(--d-text); }
.lp-dash-att-stats span { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--d-muted); }

/* ---- Sessions list ---- */
.lp-dash-sessions {
  margin-top: 18px;
  background: var(--d-card);
  border: 1px solid var(--d-border);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--d-shadow);
}
.lp-dash-sessions-head { padding: 18px 22px; border-bottom: 1px solid var(--d-border); }
.lp-dash-sessions-head h3 { margin: 0 0 3px; font-family: var(--font-display, Georgia, serif); font-size: 19px; font-weight: 600; color: var(--d-text); }
.lp-dash-sessions-head p { margin: 0; font-size: 12.5px; color: var(--d-muted); }

.lp-sess {
  display: grid;
  grid-template-columns: 40px minmax(0, 1.5fr) minmax(0, 1fr) 118px minmax(200px, 0.9fr);
  align-items: center;
  gap: 16px;
  padding: 14px 22px;
  border-bottom: 1px solid var(--d-border);
  color: var(--d-text);
  transition: background 0.12s ease;
}
.lp-sess:last-child { border-bottom: none; }
.lp-sess:not(.lp-sess-headrow):hover { background: var(--d-soft); }
.lp-sess-headrow {
  padding-top: 10px; padding-bottom: 10px;
  background: var(--d-soft);
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--d-muted);
}
.lp-sess.is-next { background: var(--d-accent-soft); box-shadow: inset 3px 0 0 var(--blue-500, #2f74e0); }
.lp-sess-num {
  width: 32px; height: 32px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 13px; font-weight: 700;
  background: var(--d-soft); border: 1px solid var(--d-border); color: var(--d-muted);
}
.lp-sess.is-next .lp-sess-num,
.lp-sess-live .lp-sess-num { background: var(--blue-700, #1e56b8); border-color: transparent; color: #fff; }
.lp-sess-done .lp-sess-num { background: #22a356; border-color: transparent; color: #fff; }
.lp-sess-main, .lp-sess-when { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lp-sess-kicker { font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--d-muted); }
.lp-sess-kicker em {
  font-style: normal; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: var(--blue-700, #1e56b8); color: #fff; letter-spacing: 0.04em;
}
.lp-sess-title { font-size: 14px; font-weight: 600; color: var(--d-text); overflow: hidden; text-overflow: ellipsis; }
.lp-sess-date { font-size: 13.5px; font-weight: 600; color: var(--d-text); }
.lp-sess-time { font-size: 12.5px; color: var(--d-muted); }

.lp-sess-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  font-size: 11.5px; font-weight: 700;
  background: var(--d-soft); color: var(--d-muted); border: 1px solid var(--d-border);
}
.lp-sess-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.lp-sess-done .lp-sess-pill { background: #e7f7ed; border-color: #c6ead3; color: #15803d; }
.lp-sess-missed .lp-sess-pill { background: #fdecec; border-color: #f6cdcd; color: #b42318; }
.lp-sess-live .lp-sess-pill { background: #fdecec; border-color: #f6cdcd; color: #d92d20; }
.lp-sess-upcoming .lp-sess-pill { background: var(--d-accent-soft); border-color: transparent; color: var(--d-accent); }
html.rg-dark .lp-sess-done .lp-sess-pill { background: #133222; border-color: #1d4a31; color: #6fdc8c; }
html.rg-dark .lp-sess-missed .lp-sess-pill,
html.rg-dark .lp-sess-live .lp-sess-pill { background: #3a1a1d; border-color: #5a2328; color: #ff9b93; }

.lp-sess-action { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.lp-sess-action .lp-attendance-hint { font-size: 11.5px; }
.lp-sess-note { font-size: 12.5px; color: var(--d-muted); }
.lp-sess-expand {
  grid-column: 1 / -1;
  padding: 14px;
  border-radius: 12px;
  background: var(--d-soft);
  border: 1px solid var(--d-border);
}
.lp-sess-expand[hidden] { display: none; }
.lp-sess-expand .lp-recording-video { max-height: 460px; }
.lp-sess-expand-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 10px; }

/* ---- Responsive ---- */
@media (max-width: 1100px) {
  .lp-dash-hero { grid-template-columns: 1fr; }
  .lp-dash-att { border-left: none; border-top: 1px solid var(--d-border); flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 18px; }
  .lp-dash-att-title { text-align: center; flex-basis: 100%; }
  .lp-dash-att-stats { flex: 1 1 260px; align-self: center; }
  .lp-sess { grid-template-columns: 40px minmax(0, 1fr) minmax(0, 1fr) auto; }
  .lp-sess-action { grid-column: 2 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .lp-sess-headrow { display: none; }
}
@media (max-width: 640px) {
  .lp-dash-hero-main { padding: 20px 18px; }
  .lp-dash-title { font-size: 21px; }
  .lp-dash-logo { width: 52px; height: 52px; }
  .lp-dash-logo img { width: 44px; height: 44px; }
  .lp-dash-next-actions { width: 100%; }
  .lp-dash-next-actions .lp-dash-btn { flex: 1 1 auto; }
  .lp-sess { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 8px 12px; padding: 14px 16px; }
  .lp-sess-when { grid-column: 2 / 3; }
  .lp-sess-status { grid-column: 3; grid-row: 1; }
  .lp-sess-action { grid-column: 2 / -1; }
  .lp-dash-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-dash-fact { padding: 10px; gap: 9px; }
  .lp-dash-fact-icon { width: 30px; height: 30px; }
  .lp-dash .announcement-card { grid-template-areas: "top" "body" "date"; grid-template-columns: 1fr; }
  .lp-dash .announcement-date { justify-self: start; }
}

/* ---- Study Material banner (between batch hero and class sessions) ---- */
.lp-dash-study {
  display: flex; align-items: center; gap: 16px;
  margin-top: 18px;
  padding: 16px 20px;
  border-radius: 16px;
  background: var(--d-card);
  border: 1px solid var(--d-border);
  box-shadow: var(--d-shadow);
  text-decoration: none;
  color: var(--d-text);
  transition: border-color 0.15s ease, transform 0.12s ease;
}
.lp-dash-study:hover { border-color: var(--blue-500, #2f74e0); transform: translateY(-1px); }
.lp-dash-study-icon {
  width: 46px; height: 46px; flex-shrink: 0;
  display: grid; place-items: center;
  border-radius: 12px;
  font-size: 22px;
  background: var(--d-accent-soft);
}
.lp-dash-study-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.lp-dash-study-text strong { font-size: 15px; color: var(--d-text); }
.lp-dash-study-text span { font-size: 13px; color: var(--d-muted); }
@media (max-width: 640px) {
  .lp-dash-study { flex-wrap: wrap; }
  .lp-dash-study-cta { width: 100%; }
}

/* ---- Session action buttons: recording + mark attendance side by side ---- */
.lp-dash .lp-act-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lp-dash .lp-mark-attendance-btn,
html.rg-dark .lp-dash .lp-mark-attendance-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 15px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: #16a34a;
  color: #fff;
  font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}
.lp-dash .lp-mark-attendance-btn:hover:not(:disabled) { background: #15803d; }
.lp-dash .lp-mark-attendance-btn:disabled,
html.rg-dark .lp-dash .lp-mark-attendance-btn:disabled {
  background: transparent;
  border: 1px dashed var(--d-border);
  color: var(--d-muted);
  cursor: not-allowed;
}
.lp-dash .lp-sess-action .lp-attendance-hint { margin: 0; font-size: 11.5px; line-height: 1.35; color: var(--d-muted); }
.lp-dash .lp-sess-action .lp-badge { font-size: 11px; padding: 5px 10px; }
@media (min-width: 1101px) {
  .lp-sess { grid-template-columns: 40px minmax(0, 1.3fr) minmax(0, 0.9fr) 118px minmax(320px, 1.1fr); }
}

/* ---- Green "Join live class" button + class start time ---- */
.lp-dash-btn-green {
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff;
  box-shadow: 0 6px 16px -8px rgba(22, 163, 74, 0.7);
}
.lp-dash-btn-green:hover { background: linear-gradient(135deg, #16a34a, #15803d); }
.lp-dash-btn-green .lp-live-dot { background: #fff; animation: lpLivePulseWhite 1.6s infinite; }
@keyframes lpLivePulseWhite {
  0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
  70% { box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}
.lp-starts-at { font-size: 12.5px; font-weight: 600; color: var(--d-text); }
.lp-sess-live .lp-sess-action { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: 12px; }
.lp-sess-live .lp-sess-action .lp-attendance-hint { flex-basis: 100%; }

/* ======================================================================
   MahaRERA dashboard — mobile polish (≤ 640px)
   ====================================================================== */
@media (max-width: 640px) {
  .app-content:has(.lp-dash) { padding: 18px 12px 40px !important; }
  .lp-dash .page-header { margin-bottom: 16px; }
  .lp-dash .page-title { font-size: 22px; }
  .lp-dash .page-subtitle { font-size: 12.5px; }

  .lp-dash .announcement-list { margin-bottom: 16px !important; gap: 8px; }
  .lp-dash .announcement-card,
  html.rg-dark .lp-dash .announcement-card { padding: 11px 14px; border-radius: 12px; }

  /* Hero */
  .lp-dash-batch { margin-bottom: 20px; }
  .lp-dash-hero { border-radius: 16px; }
  .lp-dash-hero-main { padding: 18px 14px; gap: 16px; }
  .lp-dash-id { gap: 12px; align-items: flex-start; }
  .lp-dash-logo { width: 46px; height: 46px; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.14); }
  .lp-dash-logo img { width: 38px; height: 38px; }
  .lp-dash-title { font-size: 19px; }
  .lp-dash-code { font-size: 11px; padding: 3px 9px; }
  .lp-dash-status { font-size: 9.5px; }

  .lp-dash-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .lp-dash-fact { padding: 9px 11px; gap: 0; border-radius: 10px; }
  .lp-dash-fact-icon { display: none; }
  .lp-dash-fact-label { font-size: 9.5px; }
  .lp-dash-fact-value { font-size: 13px; line-height: 1.3; }

  .lp-dash-next { padding: 12px; gap: 10px; border-radius: 12px; }
  .lp-dash-next-value { font-size: 13.5px; }
  .lp-dash-next-label { font-size: 9.5px; }
  .lp-dash-next-actions { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; }
  .lp-dash-next-actions .lp-dash-btn { flex: 1 1 130px; padding: 10px 8px; font-size: 12.5px; }
  .lp-dash-next-actions .lp-dash-btn-green { flex-basis: 100%; }

  /* Attendance: compact horizontal strip instead of a tall block */
  .lp-dash-att {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    grid-template-areas: "title title" "ring caption" "ring stats";
    align-items: center;
    gap: 6px 14px;
    padding: 14px;
  }
  .lp-dash-att-title { grid-area: title; text-align: left; font-size: 10px; }
  .lp-dash-ring { grid-area: ring; width: 92px; height: 92px; }
  .lp-dash-ring::after { inset: 9px; }
  .lp-dash-ring strong { font-size: 21px; }
  .lp-dash-ring small { font-size: 9.5px; margin-top: 2px; }
  .lp-dash-att-caption { grid-area: caption; text-align: left; font-size: 11.5px; align-self: end; }
  .lp-dash-att-stats { grid-area: stats; align-self: start; }
  .lp-dash-att-stats > div { padding: 7px 2px; }
  .lp-dash-att-stats strong { font-size: 15px; }
  .lp-dash-att-stats span { font-size: 8.5px; letter-spacing: 0.03em; }

  /* Study material: whole card is the link, small arrow instead of a big button */
  .lp-dash-study { flex-wrap: nowrap; margin-top: 14px; padding: 12px 14px; gap: 12px; border-radius: 14px; }
  .lp-dash-study-icon { width: 40px; height: 40px; font-size: 19px; border-radius: 10px; }
  .lp-dash-study-text strong { font-size: 14px; }
  .lp-dash-study-text span { font-size: 12px; }
  .lp-dash-study-cta { display: none; }
  .lp-dash-study::after { content: "›"; font-size: 26px; line-height: 1; color: var(--d-muted); flex-shrink: 0; }

  /* Sessions */
  .lp-dash-sessions { margin-top: 14px; border-radius: 16px; }
  .lp-dash-sessions-head { padding: 14px; }
  .lp-dash-sessions-head h3 { font-size: 17px; }
  .lp-dash-sessions-head p { font-size: 11.5px; }
  .lp-sess { grid-template-columns: 28px minmax(0, 1fr) auto; gap: 4px 10px; padding: 12px 14px; align-items: start; }
  .lp-sess-num { width: 28px; height: 28px; font-size: 12px; }
  .lp-sess-main { grid-column: 2; grid-row: 1; }
  .lp-sess-status { grid-column: 3; grid-row: 1; }
  .lp-sess-when { grid-column: 2 / -1; grid-row: 2; flex-direction: row; flex-wrap: wrap; gap: 0 8px; }
  .lp-sess-action { grid-column: 2 / -1; grid-row: 3; margin-top: 6px; }
  .lp-sess-action:empty { display: none; }
  .lp-sess-kicker { font-size: 9.5px; }
  .lp-sess-title { font-size: 13.5px; line-height: 1.3; }
  .lp-sess-date { font-size: 12px; }
  .lp-sess-time { font-size: 12px; }
  .lp-sess-time::before { content: "·"; margin-right: 8px; }
  .lp-sess-pill { font-size: 10px; padding: 3px 8px; }
  .lp-sess-expand { grid-column: 1 / -1; padding: 10px; }

  .lp-dash .lp-sess-action .lp-dash-btn,
  .lp-dash .lp-sess-action .lp-mark-attendance-btn { padding: 8px 12px; font-size: 12.5px; }
  .lp-dash .lp-act-row { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .lp-dash .lp-act-row > :only-child { grid-column: 1 / -1; }
  .lp-dash .lp-act-row .lp-dash-btn,
  .lp-dash .lp-act-row .lp-mark-attendance-btn { width: 100%; }
  .lp-sess-live .lp-sess-action { column-gap: 10px; row-gap: 6px; }
  .lp-starts-at { font-size: 12px; }
}

/* ======================================================================
   "Launching soon" pages (Digital Marketing / Rent Agreement)
   ====================================================================== */
.app-content:has(.lp-interest-mount) { max-width: none; }
.lp-soon2 {
  --s-card: #ffffff; --s-border: #e3eaf6; --s-text: #0b2352; --s-muted: #5b6b8c;
  --s-soft: #f5f8fe; --s-input: #ffffff; --s-shadow: 0 12px 32px -20px rgba(7, 23, 51, 0.35);
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.9fr);
  gap: 20px;
  align-items: start;
}
html.rg-dark .lp-soon2 {
  --s-card: #111a2c; --s-border: #223049; --s-text: #e6ecf7; --s-muted: #8a98b3;
  --s-soft: #0e1626; --s-input: #0b1220; --s-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.8);
}

/* Left: hero */
.lp-soon2-hero {
  border-radius: 18px;
  padding: 28px 30px;
  color: #fff;
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(127, 176, 245, 0.28) 0%, rgba(127, 176, 245, 0) 55%),
    linear-gradient(135deg, #071733 0%, #0b2352 45%, #1e56b8 100%);
  box-shadow: var(--s-shadow);
}
html.rg-dark .lp-soon2-hero {
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(79, 142, 240, 0.22) 0%, rgba(79, 142, 240, 0) 55%),
    linear-gradient(135deg, #060f22 0%, #0b1d40 50%, #163a7c 100%);
}
.lp-soon2-hero-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.lp-soon2-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 6px 12px; border-radius: 999px;
  background: rgba(224, 185, 92, 0.16); border: 1px solid rgba(224, 185, 92, 0.4); color: #f3d58a;
}
.lp-soon2-pulse { width: 7px; height: 7px; border-radius: 50%; background: #e0b95c; animation: lpLivePulse 1.8s infinite; }
.lp-soon2-icon {
  width: 52px; height: 52px; display: grid; place-items: center; font-size: 26px;
  border-radius: 14px; background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.18);
}
.lp-soon2-hero h2 { margin: 0 0 8px; font-family: var(--font-display, Georgia, serif); font-size: 28px; font-weight: 600; line-height: 1.2; color: #fff; }
.lp-soon2-hero > p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(230, 239, 255, 0.82); max-width: 640px; }
.lp-soon2-block { margin-top: 24px; }
.lp-soon2-block h4 { margin: 0 0 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: #e0b95c; }
.lp-soon2-points { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lp-soon2-points li {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 11px 13px; border-radius: 12px;
  background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.11);
  font-size: 13.5px; font-weight: 500; line-height: 1.4; color: #fff;
}
.lp-soon2-tick {
  width: 20px; height: 20px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: 50%; background: #22c55e; color: #fff; font-size: 11px; font-weight: 800;
}
.lp-soon2-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lp-soon2-steps li { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 12px; background: rgba(4, 12, 30, 0.3); border: 1px solid rgba(255, 255, 255, 0.08); }
.lp-soon2-steps li > span {
  width: 26px; height: 26px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: 50%; background: #fff; color: #0b2352; font-size: 12.5px; font-weight: 800;
}
.lp-soon2-steps strong { display: block; font-size: 13.5px; color: #fff; }
.lp-soon2-steps em { display: block; font-style: normal; font-size: 12px; line-height: 1.4; color: rgba(230, 239, 255, 0.7); margin-top: 2px; }

/* Right: form / done panel */
.lp-soon2-panel {
  position: sticky; top: 24px;
  border-radius: 18px; padding: 26px 24px;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
  color: var(--s-text);
}
.lp-soon2-panel-head h3 { margin: 0 0 4px; font-family: var(--font-display, Georgia, serif); font-size: 21px; font-weight: 600; color: var(--s-text); }
.lp-soon2-panel-head p { margin: 0 0 18px; font-size: 13px; color: var(--s-muted); }
.lp-soon2-form { display: flex; flex-direction: column; gap: 14px; }
.lp-soon2-form label { display: flex; flex-direction: column; gap: 6px; }
.lp-soon2-form label > span { font-size: 12.5px; font-weight: 600; color: var(--s-muted); }
.lp-soon2-form input {
  width: 100%; box-sizing: border-box;
  padding: 12px 14px; border-radius: 11px;
  border: 1px solid var(--s-border); background: var(--s-input); color: var(--s-text);
  font-family: inherit; font-size: 14.5px; outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.lp-soon2-form input:focus { border-color: #2f74e0; box-shadow: 0 0 0 3px rgba(47, 116, 224, 0.18); }
.lp-soon2-phone { display: flex; align-items: stretch; }
.lp-soon2-phone b {
  display: grid; place-items: center; padding: 0 12px;
  border: 1px solid var(--s-border); border-right: none; border-radius: 11px 0 0 11px;
  background: var(--s-soft); color: var(--s-muted); font-size: 14px; font-weight: 600;
}
.lp-soon2-phone input { border-radius: 0 11px 11px 0; }
.lp-soon2-signed { margin: -4px 0 0; font-size: 12px; color: var(--s-muted); }
.lp-soon2-signed strong { color: var(--s-text); font-weight: 600; }
.lp-soon2-error { padding: 10px 12px; border-radius: 10px; background: #fdecec; color: #b42318; font-size: 13px; }
html.rg-dark .lp-soon2-error { background: #3a1a1d; color: #ff9b93; }
.lp-soon2-submit {
  margin-top: 4px; padding: 13px 16px; border: none; border-radius: 11px; cursor: pointer;
  background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff;
  font-family: inherit; font-size: 15px; font-weight: 700;
  box-shadow: 0 10px 22px -12px rgba(22, 163, 74, 0.8);
  transition: transform 0.12s ease, filter 0.15s ease;
}
.lp-soon2-submit:hover { transform: translateY(-1px); filter: brightness(1.05); }
.lp-soon2-submit:disabled { opacity: 0.7; cursor: wait; transform: none; }
.lp-soon2-note { margin: 0; text-align: center; font-size: 12px; color: var(--s-muted); }

.lp-soon2-done { text-align: center; }
.lp-soon2-check {
  width: 56px; height: 56px; margin: 4px auto 14px; display: grid; place-items: center;
  border-radius: 50%; background: #e7f7ed; color: #16a34a; font-size: 26px; font-weight: 800;
  box-shadow: 0 0 0 6px rgba(34, 197, 94, 0.12);
}
html.rg-dark .lp-soon2-check { background: #133222; color: #6fdc8c; }
.lp-soon2-done h3 { margin: 0 0 6px; font-family: var(--font-display, Georgia, serif); font-size: 21px; font-weight: 600; color: var(--s-text); }
.lp-soon2-done > p { margin: 0 0 18px; font-size: 13.5px; line-height: 1.55; color: var(--s-muted); }
.lp-soon2-summary { margin: 0 0 16px; border: 1px solid var(--s-border); border-radius: 12px; overflow: hidden; text-align: left; }
.lp-soon2-summary > div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 14px; background: var(--s-soft); }
.lp-soon2-summary > div + div { border-top: 1px solid var(--s-border); }
.lp-soon2-summary dt { font-size: 12.5px; color: var(--s-muted); }
.lp-soon2-summary dd { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--s-text); text-align: right; }
.lp-soon2-edit {
  width: 100%; padding: 11px; border-radius: 11px; cursor: pointer;
  border: 1px solid var(--s-border); background: transparent; color: #2f74e0;
  font-family: inherit; font-size: 13.5px; font-weight: 600;
}
html.rg-dark .lp-soon2-edit { color: #7fb0f5; }
.lp-soon2-edit:hover { background: var(--s-soft); }

@media (max-width: 1100px) {
  .lp-soon2 { grid-template-columns: 1fr; }
  .lp-soon2-panel { position: static; order: -1; }
}
@media (max-width: 640px) {
  .app-content:has(.lp-interest-mount) { padding: 18px 12px 40px !important; }
  .lp-soon2 { gap: 14px; }
  .lp-soon2-hero { padding: 20px 16px; border-radius: 16px; }
  .lp-soon2-hero h2 { font-size: 21px; }
  .lp-soon2-hero > p { font-size: 13.5px; }
  .lp-soon2-icon { width: 44px; height: 44px; font-size: 22px; }
  .lp-soon2-points { grid-template-columns: 1fr; gap: 8px; }
  .lp-soon2-points li { padding: 10px 12px; font-size: 13px; }
  .lp-soon2-steps { grid-template-columns: 1fr; gap: 8px; }
  .lp-soon2-panel { padding: 20px 16px; border-radius: 16px; }
}

/* ======================================================================
   Study products (Short Notes / MindMaps / MCQs) — paywall + files
   ====================================================================== */
.app-content:has(.lp-product-page) { max-width: none; }
.lp-product-page, .lp-pc-overlay {
  --s-card: #ffffff; --s-border: #e3eaf6; --s-text: #0b2352; --s-muted: #5b6b8c;
  --s-soft: #f5f8fe; --s-input: #ffffff; --s-shadow: 0 12px 32px -20px rgba(7, 23, 51, 0.35);
}
html.rg-dark .lp-product-page, html.rg-dark .lp-pc-overlay {
  --s-card: #111a2c; --s-border: #223049; --s-text: #e6ecf7; --s-muted: #8a98b3;
  --s-soft: #0e1626; --s-input: #0b1220; --s-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.8);
}
.lp-product-mount { margin-bottom: 28px; }

.lp-prod-alert { padding: 13px 16px; border-radius: 12px; margin-bottom: 16px; font-size: 14px; font-weight: 600; }
.lp-prod-alert.ok { background: #e7f7ed; color: #15803d; border: 1px solid #c6ead3; }
.lp-prod-alert.bad { background: #fdecec; color: #b42318; border: 1px solid #f6cdcd; }
html.rg-dark .lp-prod-alert.ok { background: #133222; color: #6fdc8c; border-color: #1d4a31; }
html.rg-dark .lp-prod-alert.bad { background: #3a1a1d; color: #ff9b93; border-color: #5a2328; }

/* Locked: hero + buy column */
.lp-prod-lock { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.85fr); gap: 20px; align-items: start; }
.lp-prod-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.lp-prod-chips span { font-size: 12px; font-weight: 600; padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); color: #e6efff; }
.lp-prod-buy { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 14px; }
.lp-price-card {
  position: relative; border-radius: 18px; padding: 22px;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow); color: var(--s-text);
}
.lp-price-label { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--s-muted); }
.lp-price { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 6px 0 14px; }
.lp-price b { font-family: var(--font-display, Georgia, serif); font-size: 36px; font-weight: 600; color: var(--s-text); line-height: 1; }
.lp-price span { font-size: 13px; color: var(--s-muted); }
.lp-price s { font-size: 16px; color: var(--s-muted); }
.lp-price em { font-style: normal; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: #e7f7ed; color: #15803d; }
html.rg-dark .lp-price em { background: #133222; color: #6fdc8c; }
.lp-price-perks { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.lp-price-perks li { font-size: 13px; color: var(--s-muted); padding-left: 22px; position: relative; }
.lp-price-perks li::before { content: "✓"; position: absolute; left: 0; color: #16a34a; font-weight: 800; }
.lp-price-card .lp-soon2-submit { width: 100%; }
.lp-bundle-card { border: 2px solid #e0b95c; background: linear-gradient(180deg, rgba(224, 185, 92, 0.1), var(--s-card) 60%); }
.lp-bundle-ribbon {
  position: absolute; top: -11px; right: 18px;
  font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px; background: linear-gradient(135deg, #e0b95c, #c99a3a); color: #1d1503;
}
.lp-bundle-btn {
  width: 100%; padding: 12px 16px; border-radius: 11px; cursor: pointer;
  border: 1px solid #c99a3a; background: transparent; color: #9a6a12;
  font-family: inherit; font-size: 14.5px; font-weight: 700;
  transition: background 0.15s;
}
.lp-bundle-btn:hover { background: rgba(224, 185, 92, 0.15); }
html.rg-dark .lp-bundle-btn { color: #f3d58a; }
.lp-prod-note { margin: 0; padding: 12px 14px; border-radius: 12px; font-size: 12.5px; line-height: 1.5; background: var(--s-soft); border: 1px dashed var(--s-border); color: var(--s-muted); }
.lp-prod-note strong { color: var(--s-text); }

/* Owned: file cards */
.lp-prod-owned-head { margin-bottom: 14px; }
.lp-prod-owned-badge { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: 999px; font-size: 13px; font-weight: 700; background: #e7f7ed; color: #15803d; border: 1px solid #c6ead3; }
html.rg-dark .lp-prod-owned-badge { background: #133222; color: #6fdc8c; border-color: #1d4a31; }
.lp-file-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.lp-file-card {
  display: flex; gap: 16px; padding: 18px; border-radius: 16px;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
  transition: border-color 0.15s, transform 0.12s;
}
.lp-file-card:hover { border-color: #2f74e0; transform: translateY(-1px); }
.lp-file-thumb {
  width: 64px; height: 80px; flex-shrink: 0; border-radius: 10px;
  display: grid; place-items: center; font-size: 15px; font-weight: 800; letter-spacing: 0.05em;
  color: #fff; background: linear-gradient(160deg, #d92d20, #8c1d18);
  box-shadow: inset 0 -14px 0 rgba(0, 0, 0, 0.15);
}
.lp-file-body { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; flex: 1; }
.lp-file-lang { font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: rgba(47, 116, 224, 0.12); color: #2f74e0; }
html.rg-dark .lp-file-lang { color: #8fbaf7; }
.lp-file-body h3 { margin: 2px 0 0; font-size: 15.5px; font-weight: 700; color: var(--s-text); line-height: 1.3; }
.lp-file-body p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--s-muted); }
.lp-file-actions { margin-top: auto; padding-top: 10px; }
.lp-file-btn { display: inline-flex; align-items: center; padding: 9px 16px; border-radius: 10px; font-size: 13.5px; font-weight: 700; text-decoration: none; }
.lp-file-btn.primary { background: var(--blue-700, #1e56b8); color: #fff; }
.lp-file-btn.primary:hover { background: #1a4aa0; }

/* Checkout modal */
.lp-pc-overlay { position: fixed; inset: 0; z-index: 10050; display: grid; place-items: center; padding: 16px; background: rgba(4, 12, 30, 0.6); backdrop-filter: blur(3px); }
.lp-pc-modal { width: 100%; max-width: 420px; padding: 24px; border-radius: 18px; background: var(--s-card); border: 1px solid var(--s-border); color: var(--s-text); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.5); }
.lp-pc-modal h3 { margin: 0; font-family: var(--font-display, Georgia, serif); font-size: 20px; font-weight: 600; }
.lp-pc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.lp-pc-amt { font-family: var(--font-display, Georgia, serif); font-size: 26px; font-weight: 600; color: var(--s-text); }
.lp-pc-sub { margin: 4px 0 0; font-size: 13px; color: var(--s-muted); line-height: 1.5; }
.lp-pc-cancel { width: 100%; margin-top: 10px; padding: 10px; border: none; background: transparent; color: var(--s-muted); font-family: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.lp-pc-wa { display: block; text-align: center; text-decoration: none; margin-top: 16px; }

@media (max-width: 1100px) {
  .lp-prod-lock { grid-template-columns: 1fr; }
  .lp-prod-buy { position: static; }
}
@media (max-width: 640px) {
  .app-content:has(.lp-product-page) { padding: 18px 12px 40px !important; }
  .lp-file-grid { grid-template-columns: 1fr; }
  .lp-file-card { padding: 14px; gap: 12px; }
  .lp-file-thumb { width: 52px; height: 66px; font-size: 13px; }
  .lp-price-card { padding: 18px 16px; }
  .lp-price b { font-size: 30px; }
}

/* ---------- Recording attendance confirmation (Yes / Not yet) ---------- */
#lp-confirm-overlay button#lp-confirm-yes {
  width: 100%; margin-top: 6px; padding: 13px 16px; border: none; border-radius: 8px;
  background: linear-gradient(135deg, #16a34a, #15803d); color: #fff;
  font-size: 15px; font-weight: 600; cursor: pointer;
}

/* ======================================================================
   Class sessions — accordion rows
   Collapsed: number · session/day · date · status (spread full width).
   Expanded: labelled detail boxes on the left, actions on the right.
   The next / today's session is a green "live" strip.
   ====================================================================== */
.lp-dash-sessions .lp-sess.lp-sess-acc {
  display: block;
  padding: 0;
  gap: 0;
  position: relative;
}
.lp-dash-sessions .lp-sess.lp-sess-acc:hover { background: transparent; }
.lp-sess-head {
  all: unset;
  box-sizing: border-box;
  width: 100%;
  display: grid;
  grid-template-columns: 36px minmax(240px, 2fr) minmax(170px, 1.2fr) minmax(130px, 1fr) 24px;
  align-items: center;
  gap: 20px;
  padding: 15px 24px;
  cursor: pointer;
  color: var(--d-text);
  transition: background 0.12s ease;
}
.lp-sess-head:hover { background: var(--d-soft); }
.lp-sess-head:focus { outline: none; }
.lp-sess-head { -webkit-tap-highlight-color: transparent; }
.lp-sess-head:focus-visible { box-shadow: inset 0 0 0 2px rgba(79, 142, 240, 0.6); }
.lp-sess-head:focus:not(:focus-visible) { box-shadow: none; }
.lp-sess-head .lp-sess-num { width: 34px; height: 34px; }
.lp-sh-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lp-sh-main .lp-sess-title { font-size: 14.5px; white-space: nowrap; }
.lp-sh-date { font-size: 13.5px; font-weight: 600; color: var(--d-text); }
.lp-sh-status { display: flex; }
.lp-sh-chev {
  width: 9px; height: 9px;
  border-right: 2px solid var(--d-muted);
  border-bottom: 2px solid var(--d-muted);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 0.18s ease;
  justify-self: center;
}
.lp-sess-acc.is-open .lp-sh-chev { transform: rotate(-135deg) translate(-2px, -2px); }
.lp-sess-acc.is-open { background: var(--d-soft); }
.lp-sess-acc.is-open > .lp-sess-head:hover { background: transparent; }

/* ---- Expanded body ---- */
.lp-sess-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px 28px;
  padding: 2px 24px 20px 80px; /* lines up under the session title */
}
.lp-sess-body[hidden] { display: none; }
.lp-sess-info {
  display: grid;
  grid-template-columns: max-content repeat(3, minmax(0, 1fr));
  background: var(--d-card);
  border: 1px solid var(--d-border);
  border-radius: 12px;
  overflow: hidden;
}
.lp-sess-info-item {
  display: flex; flex-direction: column; gap: 3px;
  padding: 11px 16px;
  border-left: 1px solid var(--d-border);
  min-width: 0;
}
.lp-sess-info-item:first-child { border-left: none; }
.lp-sess-info-item span {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase;
  color: var(--d-muted);
}
.lp-sess-info-item strong { font-size: 13.5px; font-weight: 600; color: var(--d-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-sess-info-item.is-ok strong { color: #15803d; }
.lp-sess-info-item.is-bad strong { color: #b42318; }
html.rg-dark .lp-sess-info-item.is-ok strong { color: #6fdc8c; }
html.rg-dark .lp-sess-info-item.is-bad strong { color: #ff9b93; }

.lp-sess-body .lp-sess-action {
  grid-column: auto; grid-row: auto; margin-top: 0; /* cancel the old table-layout placement */
  flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-end;
  gap: 8px 10px;
  max-width: 460px;
}
.lp-sess-body .lp-sess-action .lp-attendance-hint { flex-basis: 100%; text-align: right; }
.lp-sess-body .lp-act-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.lp-sess-body .lp-sess-action .lp-dash-btn,
.lp-sess-body .lp-sess-action .lp-mark-attendance-btn { padding: 10px 16px; }
.lp-sess-body .lp-sess-expand { grid-column: 1 / -1; margin-top: 0; }

/* ---- Next / today's session: green "live" strip ---- */
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next {
  background: linear-gradient(90deg, rgba(34, 197, 94, 0.16), rgba(34, 197, 94, 0.05) 60%, rgba(34, 197, 94, 0.02));
  box-shadow: inset 4px 0 0 #22c55e, inset 0 1px 0 rgba(34, 197, 94, 0.35), inset 0 -1px 0 rgba(34, 197, 94, 0.35);
}
.lp-sess-acc.is-next > .lp-sess-head:hover { background: rgba(34, 197, 94, 0.06); }
.lp-sess-acc.is-next .lp-sess-num {
  background: #16a34a; border-color: transparent; color: #fff;
  animation: lpSessPulse 2s infinite;
}
.lp-sess-acc.is-next .lp-sess-kicker em {
  background: #16a34a; color: #fff;
  display: inline-flex; align-items: center; gap: 5px;
}
.lp-sess-acc.is-next .lp-sess-kicker em::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff;
  animation: lpLivePulseWhite 1.6s infinite;
}
.lp-sess-acc.is-next .lp-sess-pill { background: #e7f7ed; border-color: #b8e6c9; color: #15803d; }
.lp-sess-acc.is-next .lp-sess-pill::before { animation: lpSessDot 1.4s infinite; }
html.rg-dark .lp-sess-acc.is-next .lp-sess-pill { background: #133222; border-color: #1f5a37; color: #6fdc8c; }
.lp-sess-acc.is-next .lp-sh-date { color: #15803d; }
html.rg-dark .lp-sess-acc.is-next .lp-sh-date { color: #6fdc8c; }
.lp-sess-acc.is-next .lp-sess-info { border-color: rgba(34, 197, 94, 0.35); }
.lp-sess-acc.is-next .lp-sess-info-item { border-left-color: rgba(34, 197, 94, 0.25); }
@keyframes lpSessPulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55); }
  70% { box-shadow: 0 0 0 9px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}
@keyframes lpSessDot { 50% { opacity: 0.25; } }
@media (prefers-reduced-motion: reduce) {
  .lp-sess-acc.is-next .lp-sess-num,
  .lp-sess-acc.is-next .lp-sess-kicker em::before,
  .lp-sess-acc.is-next .lp-sess-pill::before { animation: none; }
}

/* ---- Medium screens ---- */
@media (max-width: 1100px) {
  .lp-sess-head { grid-template-columns: 34px minmax(0, 1.6fr) minmax(0, 1fr) auto 20px; gap: 16px; padding: 14px 20px; }
  .lp-sess-body { grid-template-columns: 1fr; padding: 2px 20px 18px 70px; }
  .lp-sess-body .lp-sess-action { justify-content: flex-start; max-width: none; }
  .lp-sess-body .lp-sess-action .lp-attendance-hint { text-align: left; }
  .lp-sess-body .lp-act-row { justify-content: flex-start; }
}
@media (max-width: 860px) {
  .lp-sess-info { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-sess-info-item:nth-child(3) { border-left: none; }
  .lp-sess-info-item:nth-child(n + 3) { border-top: 1px solid var(--d-border); }
}

/* ---- Phones ---- */
@media (max-width: 640px) {
  .lp-sess-head {
    grid-template-columns: 28px minmax(0, 1fr) auto 14px;
    grid-template-areas: "num main status chev" "num date status chev";
    gap: 2px 10px;
    padding: 12px 14px;
  }
  .lp-sess-head .lp-sess-num { grid-area: num; align-self: start; width: 28px; height: 28px; }
  .lp-sh-main { grid-area: main; }
  .lp-sh-main .lp-sess-title { white-space: normal; font-size: 13.5px; }
  .lp-sh-date { grid-area: date; font-size: 12px; color: var(--d-muted); font-weight: 500; }
  .lp-sh-status { grid-area: status; }
  .lp-sh-chev { grid-area: chev; width: 7px; height: 7px; }
  .lp-sess-body { padding: 2px 14px 14px 52px; gap: 10px; }
  .lp-sess-info-item { padding: 9px 11px; }
  .lp-sess-info-item span { font-size: 9.5px; }
  .lp-sess-info-item strong { font-size: 12.5px; }
  .lp-dash .lp-sess-body .lp-act-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; }
  .lp-dash .lp-sess-body .lp-act-row > * { min-width: 0; white-space: normal; justify-content: center; text-align: center; }
  .lp-sess-body .lp-sess-action .lp-dash-btn,
  .lp-sess-body .lp-sess-action .lp-mark-attendance-btn { padding: 9px 12px; }
  .lp-sess-body .lp-sess-expand { margin-left: -38px; }
}

/* ======================================================================
   Session actions — high-contrast buttons in a fixed right-hand column
   ====================================================================== */
.lp-sess-body { grid-template-columns: minmax(0, 1fr) 300px; align-items: stretch; }
.lp-dash .lp-sess-body .lp-sess-action {
  display: flex; flex-direction: column; align-items: stretch; justify-content: center;
  gap: 8px; max-width: none;
}
.lp-dash .lp-sess-body .lp-act-row { display: flex; flex-direction: column; align-items: stretch; gap: 8px; width: 100%; }
.lp-dash .lp-sess-body .lp-sess-action .lp-dash-btn,
.lp-dash .lp-sess-body .lp-sess-action .lp-mark-attendance-btn {
  width: 100%; min-height: 42px; padding: 10px 16px;
  font-size: 13.5px; font-weight: 700; border-radius: 10px;
}
.lp-dash .lp-sess-body .lp-sess-action .lp-attendance-hint {
  flex-basis: auto; text-align: left;
  display: flex; gap: 6px; align-items: flex-start;
  font-size: 12px; line-height: 1.4; color: var(--d-muted);
}
.lp-sess-body .lp-sess-note {
  display: flex; align-items: center; justify-content: center; min-height: 42px;
  border: 1px dashed var(--d-border); border-radius: 10px; font-size: 12.5px;
}

/* Watch recording — solid blue */
.lp-dash .lp-dash-btn-rec {
  background: #2563eb; border-color: #2563eb; color: #fff;
  box-shadow: 0 6px 16px -10px rgba(37, 99, 235, 0.9);
}
.lp-dash .lp-dash-btn-rec:hover { background: #1d4ed8; border-color: #1d4ed8; }
.lp-dash .lp-dash-btn-rec.is-playing { background: transparent; color: var(--d-text); border-color: var(--d-border); box-shadow: none; }
html.rg-dark .lp-dash .lp-dash-btn-rec { background: #3b82f6; border-color: #3b82f6; }
html.rg-dark .lp-dash .lp-dash-btn-rec:hover { background: #2563eb; border-color: #2563eb; }

/* Mark attendance — solid green when ready, clear "locked" card when not */
.lp-dash .lp-sess-body .lp-mark-attendance-btn::before { content: "✓"; font-weight: 800; }
.lp-dash .lp-sess-body .lp-mark-attendance-btn:not(:disabled) { box-shadow: 0 6px 16px -10px rgba(22, 163, 74, 0.9); }
.lp-dash .lp-sess-body .lp-mark-attendance-btn:disabled,
html.rg-dark .lp-dash .lp-sess-body .lp-mark-attendance-btn:disabled {
  background: var(--d-card);
  border: 1px solid var(--d-border);
  color: var(--d-text);
  opacity: 0.75;
}
.lp-dash .lp-sess-body .lp-mark-attendance-btn:disabled::before { content: "🔒"; font-size: 12px; font-weight: 400; }
.lp-dash .lp-sess-body .lp-badge { align-self: stretch; text-align: center; padding: 11px 14px; font-size: 12.5px; border-radius: 10px; }

/* Live class: join button + start time + hint stacked in the column */
.lp-sess-live .lp-sess-body .lp-sess-action { flex-direction: column; }
.lp-sess-body .lp-starts-at { text-align: center; font-size: 12.5px; }

@media (max-width: 1100px) {
  .lp-sess-body { grid-template-columns: minmax(0, 1fr) 260px; padding: 2px 20px 18px 70px; }
}
@media (max-width: 860px) {
  .lp-sess-body { grid-template-columns: 1fr; }
  .lp-dash .lp-sess-body .lp-act-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .lp-dash .lp-sess-body .lp-act-row > :only-child { grid-column: 1 / -1; }
}

/* ---- Phones: full-width body, big tap targets ---- */
@media (max-width: 640px) {
  .lp-sess-body { padding: 0 14px 16px 14px; gap: 10px; }
  .lp-sess-info { border-radius: 10px; }
  .lp-dash .lp-sess-body .lp-act-row { gap: 8px; }
  .lp-dash .lp-sess-body .lp-act-row > * { white-space: nowrap; }
  .lp-dash .lp-sess-body .lp-sess-action .lp-dash-btn,
  .lp-dash .lp-sess-body .lp-sess-action .lp-mark-attendance-btn { min-height: 46px; font-size: 13.5px; padding: 10px 8px; }
  .lp-dash .lp-sess-body .lp-sess-action .lp-attendance-hint { font-size: 11.5px; }
  .lp-sess-body .lp-sess-expand { margin-left: 0; }
  .lp-sess-head { padding: 13px 14px; }
}
@media (max-width: 360px) {
  .lp-dash .lp-sess-body .lp-act-row { grid-template-columns: 1fr; }
}
.lp-sess-body .lp-sess-info { align-self: center; }

/* ======================================================================
   Recorded sessions — attendance request (admin approval)
   ====================================================================== */
.lp-dash .lp-sess-body .lp-req-btn:not(:disabled)::before { content: "📝"; font-weight: 400; }
.lp-req-note {
  margin: 0;
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  color: #92400e;
  font-size: 12px; line-height: 1.45;
}
.lp-req-note strong { font-weight: 700; }
.lp-req-note-bad { background: rgba(220, 38, 38, 0.08); border-color: rgba(220, 38, 38, 0.28); color: #b42318; }
html.rg-dark .lp-req-note { color: #fcd34d; background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.28); }
html.rg-dark .lp-req-note-bad { color: #ff9b93; background: rgba(220, 38, 38, 0.1); border-color: rgba(220, 38, 38, 0.3); }
.lp-req-pending {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 42px; padding: 9px 12px;
  border-radius: 10px;
  background: #fef3c7; border: 1px solid #fcd34d; color: #92400e;
  font-size: 13px; font-weight: 700; text-align: center;
}
html.rg-dark .lp-req-pending { background: rgba(245, 158, 11, 0.14); border-color: rgba(245, 158, 11, 0.4); color: #fcd34d; }

/* "Pending approval" status pill + number */
.lp-sess-pending .lp-sess-pill { background: #fef3c7; border-color: #fcd34d; color: #92400e; }
html.rg-dark .lp-sess-pending .lp-sess-pill { background: rgba(245, 158, 11, 0.14); border-color: rgba(245, 158, 11, 0.4); color: #fcd34d; }
.lp-sess-pending .lp-sess-num { border-color: #f59e0b; color: #f59e0b; }
.lp-sess-info-item.is-warn strong { color: #b45309; }
html.rg-dark .lp-sess-info-item.is-warn strong { color: #fcd34d; }
.lp-sh-status .lp-sess-pill { white-space: nowrap; }

/* Phones: request button spans both columns when the note sits below */
@media (max-width: 640px) {
  .lp-req-note { font-size: 11.5px; }
}

/* Request note sits under the details box (left), buttons stay on the right */
.lp-sess-body > .lp-req-note { grid-column: 1; align-self: start; }
.lp-dash .lp-sess-body:has(> .lp-req-note) > .lp-sess-action { grid-column: 2; grid-row: 1 / span 2; }
.lp-sess-body:has(> .lp-req-note) > .lp-sess-info { align-self: end; }
@media (max-width: 860px) {
  .lp-dash .lp-sess-body:has(> .lp-req-note) > .lp-sess-action { grid-column: 1; grid-row: auto; }
}
.lp-dash .lp-sess-body .lp-act-row > .lp-req-pending,
.lp-sess-body .lp-req-pending { white-space: normal; min-width: 0; font-size: 12.5px; line-height: 1.3; }

/* Attendance requirement met: full green ring with a tick, no numbers */
.lp-dash-ring.is-complete { background: conic-gradient(#22a356 100%, #22a356 0); box-shadow: 0 0 0 6px rgba(34, 163, 86, 0.12); }
.lp-ring-check {
  display: grid; place-items: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: #22a356; color: #fff;
  font-size: 26px; font-weight: 800; line-height: 1;
}
.lp-dash-ring.is-complete small { font-size: 12px; font-weight: 700; color: #15803d; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 6px; }
html.rg-dark .lp-dash-ring.is-complete small { color: #6fdc8c; }
.lp-att-done { font-size: 13.5px !important; font-weight: 600; line-height: 1.45; text-align: center; max-width: 240px; }
@media (max-width: 640px) {
  .lp-dash-att:has(.lp-att-done) { grid-template-areas: "title title" "ring caption"; }
  .lp-ring-check { width: 34px; height: 34px; font-size: 19px; }
  .lp-dash-ring.is-complete small { font-size: 9.5px; margin-top: 3px; }
  .lp-att-done { text-align: left; align-self: center !important; font-size: 12.5px !important; max-width: none; }
}

/* ======================================================================
   Study material — "Claim for free" for enrolled MahaRERA students
   ====================================================================== */
.lp-claim-card { border: 2px solid #22a356; background: linear-gradient(180deg, rgba(34, 163, 86, 0.1), var(--s-card) 60%); }
.lp-claim-ribbon {
  position: absolute; top: -11px; right: 18px;
  font-size: 11px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px; background: linear-gradient(135deg, #22c55e, #15803d); color: #fff;
}
.lp-price s.lp-claim-mrp { font-family: var(--font-display, Georgia, serif); font-size: 22px; text-decoration-thickness: 2px; text-decoration-color: #dc2626; }
.lp-claim-card .lp-price b { color: #15803d; }
html.rg-dark .lp-claim-card .lp-price b { color: #6fdc8c; }
.lp-price-card .lp-claim-btn {
  background: linear-gradient(135deg, #22c55e, #15803d) !important;
  box-shadow: 0 10px 22px -12px rgba(22, 163, 74, 0.9);
}
.lp-price-card .lp-claim-btn:disabled,
.lp-bundle-btn:disabled { opacity: 0.7; cursor: wait; }

/* ======================================================================
   MahaRERA hero — course banner on the left, batch info on the right.
   Uses a container query so it stacks whenever the card itself is narrow
   (e.g. laptop widths where the attendance panel sits beside it).
   ====================================================================== */
.lp-sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.lp-dash-hero-main.has-banner { container-type: inline-size; padding: 20px; display: block; }
.lp-dash-split { display: flex; flex-direction: column; gap: 22px; }
.lp-dash-hero-main:not(.has-banner) .lp-dash-split { gap: 22px; }
.lp-dash-hero-info { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.lp-dash-banner {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  aspect-ratio: 1400 / 694;
  background: #0b2352;
  box-shadow: 0 18px 36px -22px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(224, 185, 92, 0.35);
}
.lp-dash-banner img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-dash-id-compact { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.lp-dash-id-compact .lp-dash-status {
  padding: 5px 11px; border-radius: 999px;
  background: rgba(74, 222, 128, 0.12); border: 1px solid rgba(74, 222, 128, 0.3);
}
.lp-dash-hero-main.has-banner .lp-dash-facts { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

/* Wide card: banner + info side by side */
@container (min-width: 780px) {
  .lp-dash-split {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    align-items: center;
    gap: 26px;
  }
}

@media (max-width: 640px) {
  .lp-dash-hero-main.has-banner { padding: 12px 12px 16px; }
  .lp-dash-split { gap: 14px; }
  .lp-dash-banner { border-radius: 11px; }
  .lp-dash-hero-info { gap: 14px; padding: 0 2px; }
}
.lp-dash-hero-main.has-banner .lp-dash-fact { padding: 10px 12px; gap: 10px; }
.lp-dash-hero-main.has-banner .lp-dash-fact-icon { width: 30px; height: 30px; }
.lp-dash-hero-main.has-banner .lp-dash-fact-value { font-size: 13.5px; white-space: nowrap; }

/* ======================================================================
   Poppins everywhere (body text, headings, buttons and form fields)
   ====================================================================== */
:root {
  --font-body: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
html, body { font-family: var(--font-body); }
button, input, select, textarea, optgroup { font-family: inherit; }
/* Headings that used the old serif display font: keep them bold and tidy in Poppins */
h1, h2, h3, h4,
.lp-dash-sessions-head h3, .lp-dash-title, .lp-price b {
  font-family: var(--font-display);
  letter-spacing: -0.01em;
}
/* Poppins runs wider than the old font — keep sidebar items on one line where they fit */
.sidebar-link { font-size: 13px; letter-spacing: -0.005em; }
.sidebar-section-label { letter-spacing: 0.08em; }

/* ======================================================================
   Sidebar v2 — section badge, "Other Study Material" dropdown, price tag,
   and Certificates/Profile pushed to the bottom above Admission Counsellor
   ====================================================================== */
.sidebar-link-text { flex: 1; min-width: 0; }
.sidebar-section-label { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.sidebar-section-badge {
  display: inline-flex; align-items: center;
  padding: 2px 8px; border-radius: 999px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.02em; text-transform: none;
  background: linear-gradient(135deg, #22c55e, #15803d); color: #fff;
}
.sidebar-link-tag {
  flex-shrink: 0;
  padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700;
  background: #fef3c7; color: #92400e;
}
html.rg-dark .sidebar-link-tag { background: rgba(245, 158, 11, 0.16); color: #fcd34d; }

.sidebar-group { margin: 0; }
.sidebar-group > summary { list-style: none; cursor: pointer; user-select: none; }
.sidebar-group > summary::-webkit-details-marker { display: none; }
.sidebar-group-chev { flex-shrink: 0; transition: transform 0.18s ease; opacity: 0.7; }
.sidebar-group[open] > summary .sidebar-group-chev { transform: rotate(180deg); }
.sidebar-group-toggle.has-active { color: inherit; font-weight: 600; }
.sidebar-group-items {
  display: flex; flex-direction: column; gap: 2px;
  margin: 2px 0 4px 20px; padding-left: 10px;
  border-left: 1px solid var(--ice-200, #e2ecfc);
}
html.rg-dark .sidebar-group-items { border-left-color: #223049; }
.sidebar-sublink { padding-top: 8px !important; padding-bottom: 8px !important; font-size: 12.5px !important; }

.sidebar-spacer { flex: 1 0 14px; min-height: 14px; }
.sidebar-spacer ~ .lp-counsellor-nav-btn { margin-top: 10px; }

/* ======================================================================
   Study library pages + video player
   ====================================================================== */
.lp-lib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.lp-lib-card h3 { margin: 0 0 4px; font-size: 15px; font-weight: 600; color: var(--s-text); line-height: 1.35; }
.lp-lib-card p { margin: 0; font-size: 12.5px; color: var(--s-muted); line-height: 1.5; }
.lp-lib-thumb-test { background: linear-gradient(135deg, #2563eb, #0b2352) !important; font-size: 26px; }

.lp-lib-video {
  all: unset; box-sizing: border-box; cursor: pointer;
  display: flex; flex-direction: column;
  border-radius: 16px; overflow: hidden;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
  transition: border-color 0.15s, transform 0.12s;
}
.lp-lib-video:hover { border-color: #2f74e0; transform: translateY(-2px); }
.lp-lib-video:focus-visible { outline: 2px solid #2f74e0; outline-offset: 2px; }
.lp-lib-thumb {
  position: relative; display: block; aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, #0b2352, #1e56b8);
}
.lp-lib-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-lib-thumb-fallback { position: absolute; inset: 0; display: grid; place-items: center; font-size: 40px; }
.lp-lib-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 58px; height: 58px; border-radius: 50%;
  display: grid; place-items: center; padding-left: 4px;
  background: rgba(220, 38, 38, 0.92); color: #fff; font-size: 20px;
  box-shadow: 0 10px 24px -8px rgba(0, 0, 0, 0.6);
  transition: transform 0.15s;
}
.lp-lib-video:hover .lp-lib-play { transform: translate(-50%, -50%) scale(1.08); }
.lp-lib-body { display: block; padding: 14px 16px 16px; }

.lp-lib-empty, .lp-lib-locked {
  max-width: 560px; padding: 36px 28px; text-align: center;
  border-radius: 18px; background: var(--s-card); border: 1px dashed var(--s-border); color: var(--s-muted);
}
.lp-lib-empty span { font-size: 34px; }
.lp-lib-empty p { margin: 10px 0 0; font-size: 14px; }
.lp-lib-locked { border-style: solid; }
.lp-lib-locked-icon { font-size: 34px; }
.lp-lib-locked h3 { margin: 10px 0 6px; font-size: 18px; color: var(--s-text); }
.lp-lib-locked p { margin: 0 0 18px; font-size: 13.5px; line-height: 1.55; }

#lp-video-overlay {
  position: fixed; inset: 0; z-index: 10050;
  display: flex; align-items: center; justify-content: center;
  padding: 24px; background: rgba(3, 8, 20, 0.86);
}
.lp-video-modal { width: min(1100px, 100%); }
.lp-video-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.lp-video-head h3 { margin: 0; font-size: 15px; font-weight: 600; color: #fff; }
.lp-video-close {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255, 255, 255, 0.14); color: #fff; font-size: 16px;
}
.lp-video-close:hover { background: rgba(255, 255, 255, 0.24); }
.lp-video-frame { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; }
.lp-video-frame iframe, .lp-video-frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

@media (max-width: 640px) {
  .lp-lib-grid { grid-template-columns: 1fr; gap: 12px; }
  #lp-video-overlay { padding: 12px; }
  .lp-lib-empty, .lp-lib-locked { padding: 28px 18px; }
}
.lp-lib-thumb-link { background: linear-gradient(135deg, #2f74e0, #123a7a) !important; font-size: 24px; }

/* Longer menu: a little wider on desktop and tighter rows so it all fits */
@media (min-width: 761px) {
  .app-sidebar { width: 272px; }
  .sidebar-nav .sidebar-link { padding-top: 8px; padding-bottom: 8px; }
  .sidebar-nav .sidebar-divider { margin-top: 6px; margin-bottom: 6px; }
  .sidebar-nav .sidebar-section-label { padding-top: 4px; padding-bottom: 4px; }
}

/* ======================================================================
   Sidebar v3 — colour-coded section cards with icon tiles
   ====================================================================== */
.sidebar-nav { --tone: #2f74e0; --tone-rgb: 47, 116, 224; gap: 4px !important; }
.sidebar-card.tone-blue   { --tone: #2f74e0; --tone-rgb: 47, 116, 224; }
.sidebar-card.tone-gold   { --tone: #b7862a; --tone-rgb: 201, 154, 58; }
.sidebar-card.tone-violet { --tone: #7c5cff; --tone-rgb: 124, 92, 255; }
.sidebar-card.tone-teal   { --tone: #0f9f9a; --tone-rgb: 15, 159, 154; }
.sidebar-card.tone-slate  { --tone: #64748b; --tone-rgb: 100, 116, 139; }
html.rg-dark .sidebar-card.tone-gold { --tone: #e0b95c; }
html.rg-dark .sidebar-card.tone-violet { --tone: #a48bff; }
html.rg-dark .sidebar-card.tone-teal { --tone: #2dd4bf; }
html.rg-dark .sidebar-card.tone-slate { --tone: #94a3b8; }
html.rg-dark .sidebar-nav { --tone: #6ea3f5; }

/* Section card */
.sidebar-card {
  margin: 6px 0 4px;
  padding: 6px;
  border-radius: 14px;
  background: rgba(var(--tone-rgb), 0.045);
  border: 1px solid rgba(var(--tone-rgb), 0.12);
  display: flex; flex-direction: column; gap: 1px;
}
.sidebar-card-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 5px 8px 6px;
}
.sidebar-card-title {
  display: flex; flex-direction: column;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--tone);
}
.sidebar-card-title small {
  font-size: 10.5px; font-weight: 500; letter-spacing: 0; text-transform: none;
  color: #8ea0bf; margin-top: 1px;
}
.sidebar-card-badge {
  flex-shrink: 0;
  padding: 3px 8px; border-radius: 999px;
  font-size: 10px; font-weight: 700; white-space: nowrap;
  background: linear-gradient(135deg, #22c55e, #15803d); color: #fff;
  box-shadow: 0 4px 10px -6px rgba(22, 163, 74, 0.9);
}
/* Premium gold card for the free special material */
.sidebar-card.tone-gold {
  background: linear-gradient(160deg, rgba(224, 185, 92, 0.16), rgba(224, 185, 92, 0.04) 70%);
  border-color: rgba(201, 154, 58, 0.38);
}

/* Links */
.sidebar-nav .sidebar-link {
  gap: 10px;
  padding: 6px 8px !important;
  border-radius: 10px;
  font-size: 13px; font-weight: 500;
  transition: background 0.12s ease, color 0.12s ease;
}
.sidebar-ico {
  flex-shrink: 0;
  width: 30px; height: 30px; border-radius: 9px;
  display: grid; place-items: center;
  background: rgba(var(--tone-rgb), 0.12);
  color: var(--tone);
  transition: background 0.12s ease, color 0.12s ease;
}
.sidebar-nav .sidebar-link:hover { background: rgba(var(--tone-rgb), 0.08); }
.sidebar-nav .sidebar-link.active,
html.rg-dark .sidebar-nav .sidebar-link.active {
  background: rgba(var(--tone-rgb), 0.16);
  color: var(--tone);
  font-weight: 600;
}
.sidebar-nav .sidebar-link.active .sidebar-ico {
  background: var(--tone); color: #fff;
  box-shadow: 0 6px 14px -8px rgba(var(--tone-rgb), 0.9);
}
html.rg-dark .sidebar-card.tone-gold .sidebar-link.active .sidebar-ico { color: #1d1503; }

/* Top-level items (MahaRERA Training, Certificates, Profile) */
.sidebar-nav > .sidebar-link { padding: 7px 8px !important; }

/* Dropdown inside the Resources card */
.sidebar-group-toggle.has-active { background: transparent; }
.sidebar-group-items {
  margin: 1px 0 4px 22px !important; padding-left: 10px !important;
  border-left: 2px solid rgba(var(--tone-rgb), 0.25) !important;
}
.sidebar-nav .sidebar-sublink { padding: 5px 8px !important; font-size: 12.5px !important; }
.sidebar-sublink .sidebar-ico { width: 24px; height: 24px; border-radius: 7px; }

/* "₹500" tag on the revision video */
.sidebar-link-tag { background: rgba(var(--tone-rgb), 0.14); color: var(--tone); }
html.rg-dark .sidebar-link-tag { background: rgba(var(--tone-rgb), 0.2); color: var(--tone); }

/* Dark mode surfaces */
html.rg-dark .sidebar-card { background: rgba(var(--tone-rgb), 0.06); border-color: rgba(var(--tone-rgb), 0.16); }
html.rg-dark .sidebar-card.tone-gold {
  background: linear-gradient(160deg, rgba(224, 185, 92, 0.14), rgba(224, 185, 92, 0.03) 70%);
  border-color: rgba(224, 185, 92, 0.32);
}
html.rg-dark .sidebar-card-title small { color: #7d8db0; }

/* Bottom items sit just above Admission Counsellor */
.sidebar-spacer { flex: 1 0 10px; min-height: 10px; }
/* v3 tightening */
.sidebar-card { padding: 4px 5px 5px; margin: 5px 0 3px; }
.sidebar-card-head { padding: 6px 7px 4px; }
.sidebar-card.tone-gold .sidebar-card-head { flex-direction: column; align-items: flex-start; gap: 6px; }
.sidebar-ico { width: 26px; height: 26px; border-radius: 8px; }
.sidebar-nav .sidebar-link { padding: 5px 7px !important; min-height: 36px; }
.sidebar-nav > .sidebar-link { padding: 6px 8px !important; }
.sidebar-sublink .sidebar-ico { width: 22px; height: 22px; border-radius: 6px; }
.sidebar-nav .sidebar-sublink { min-height: 32px; }

/* Collapsible "Other Trainings" card */
.sidebar-card-fold > summary { list-style: none; cursor: pointer; user-select: none; border-radius: 10px; }
.sidebar-card-fold > summary::-webkit-details-marker { display: none; }
.sidebar-card-fold > summary:hover { background: rgba(var(--tone-rgb), 0.08); }
.sidebar-card-fold > summary .sidebar-card-title { flex: 1; }
.sidebar-card-count {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
  display: grid; place-items: center;
  font-size: 10px; font-weight: 700;
  background: rgba(var(--tone-rgb), 0.16); color: var(--tone);
}
.sidebar-card-fold > summary .sidebar-group-chev { color: var(--tone); }
.sidebar-card-fold[open] > summary .sidebar-group-chev { transform: rotate(180deg); }
.sidebar-card-fold:not([open]) { padding-bottom: 4px; }
.sidebar-card-body { display: flex; flex-direction: column; gap: 1px; }

/* No outline after a mouse click on dropdown toggles — keyboard focus still shows */
.sidebar-group > summary:focus,
.sidebar-card-fold > summary:focus { outline: none; }
.sidebar-group > summary:focus-visible,
.sidebar-card-fold > summary:focus-visible { outline: 2px solid rgba(var(--tone-rgb), 0.6); outline-offset: -2px; }

/* Thin, subtle scrollbar on the menu */
.sidebar-nav { scrollbar-width: thin; scrollbar-color: rgba(127, 145, 180, 0.35) transparent; }
.sidebar-nav::-webkit-scrollbar { width: 4px; }
.sidebar-nav::-webkit-scrollbar-track { background: transparent; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(127, 145, 180, 0.35); border-radius: 999px; }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: rgba(127, 145, 180, 0.6); }

/* Handbook cards with the book cover */
.lp-lib-book {
  display: flex; gap: 20px; align-items: stretch;
  padding: 18px; border-radius: 18px; text-decoration: none;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
  transition: border-color 0.15s, transform 0.12s;
  max-width: 560px;
}
.lp-lib-book:hover { border-color: #2f74e0; transform: translateY(-2px); }
.lp-lib-book-cover {
  flex-shrink: 0; width: 132px; aspect-ratio: 420 / 594;
  border-radius: 6px 10px 10px 6px; overflow: hidden; background: #fff;
  box-shadow: -3px 0 0 rgba(0, 0, 0, 0.12) inset, 0 14px 28px -14px rgba(0, 0, 0, 0.55);
}
.lp-lib-book-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-lib-book-body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; padding: 4px 0; }
.lp-lib-book-tag {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em;
  padding: 3px 9px; border-radius: 999px; background: rgba(220, 38, 38, 0.12); color: #dc2626;
}
.lp-lib-book h3 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--s-text); }
.lp-lib-book p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--s-muted); }
.lp-lib-book .lp-file-btn { margin-top: auto; }
@media (max-width: 640px) {
  .lp-lib-book { gap: 14px; padding: 14px; }
  .lp-lib-book-cover { width: 96px; }
  .lp-lib-book h3 { font-size: 15px; }
}
.lp-lib-grid:has(.lp-lib-book) { grid-template-columns: repeat(auto-fill, minmax(min(100%, 480px), 1fr)); }
.lp-lib-book .lp-file-btn { white-space: nowrap; }

/* Revision video — plays inline once claimed/bought */
.lp-rv-wrap { max-width: 1100px; }
.lp-rv-player {
  position: relative; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: #000;
  box-shadow: 0 24px 50px -28px rgba(0, 0, 0, 0.85);
}
.lp-rv-player iframe, .lp-rv-player video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lp-rv-meta { padding: 16px 4px 4px; }
.lp-rv-meta h3 { margin: 0 0 4px; font-size: 18px; font-weight: 600; color: var(--s-text); }
.lp-rv-meta p { margin: 0; font-size: 13.5px; color: var(--s-muted); }
.lp-rv-more { margin-top: 18px; }
@media (max-width: 640px) {
  .lp-rv-player { border-radius: 12px; }
  .lp-rv-meta h3 { font-size: 16px; }
}

/* ======================================================================
   Mock tests — hub, list, instructions, exam screen, result
   ====================================================================== */
.lp-mock-hub { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; max-width: 1100px; }
.lp-mock-option {
  all: unset; box-sizing: border-box; cursor: pointer;
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 18px;
  padding: 24px; border-radius: 20px; color: #fff;
  box-shadow: 0 20px 40px -26px rgba(7, 23, 51, 0.8);
  transition: transform 0.15s, box-shadow 0.15s;
}
.lp-mock-option::after {
  content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
}
.lp-mock-option:hover { transform: translateY(-3px); box-shadow: 0 26px 46px -24px rgba(7, 23, 51, 0.9); }
.lp-mock-option:focus-visible { outline: 3px solid #e0b95c; outline-offset: 3px; }
.lp-mock-unit { background: linear-gradient(135deg, #1e56b8, #0b2352); }
.lp-mock-exam { background: linear-gradient(135deg, #6d28d9, #1e1b4b); }
.lp-mock-option-icon { flex-shrink: 0; width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; font-size: 32px; background: rgba(255, 255, 255, 0.14); }
.lp-mock-option-body { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.lp-mock-option-label { font-size: 20px; font-weight: 700; }
.lp-mock-option-tag { font-size: 13px; line-height: 1.5; color: rgba(230, 239, 255, 0.82); }
.lp-mock-option-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 6px; }
.lp-mock-option-go { position: relative; z-index: 1; font-size: 22px; opacity: 0.85; }
.lp-mock-chip { padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; }
.lp-mock-chip.ok { background: rgba(74, 222, 128, 0.18); color: #a8f0c0; }
.lp-mock-chip.lock { background: rgba(224, 185, 92, 0.2); color: #f5d98b; }
.lp-mock-stats { font-size: 12px; color: rgba(230, 239, 255, 0.75); }

.lp-mock-back { all: unset; cursor: pointer; display: inline-block; margin-bottom: 14px; font-size: 13px; font-weight: 600; color: #2f74e0; }
html.rg-dark .lp-mock-back { color: #7fb0f5; }
.lp-mock-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.lp-mock-head-icon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; background: rgba(47, 116, 224, 0.12); }
.lp-mock-head h2 { margin: 0; font-size: 22px; color: var(--s-text); }
.lp-mock-head p { margin: 2px 0 0; font-size: 13px; color: var(--s-muted); }

.lp-mock-unlock {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px;
  padding: 22px; margin-bottom: 20px; border-radius: 18px;
  background: linear-gradient(135deg, rgba(224, 185, 92, 0.16), rgba(224, 185, 92, 0.04));
  border: 1px solid rgba(201, 154, 58, 0.4);
}
.lp-mock-unlock h3 { margin: 4px 0 6px; font-size: 19px; color: var(--s-text); }
.lp-mock-unlock p { margin: 0; font-size: 13px; color: var(--s-muted); line-height: 1.5; }
.lp-mock-unlock .lp-mock-unlock-note { margin-top: 8px; }
.lp-mock-unlock-kicker { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #b7862a; }
html.rg-dark .lp-mock-unlock-kicker { color: #e0b95c; }
.lp-mock-unlock-buy { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-width: 220px; }
.lp-mock-price { font-size: 32px; font-weight: 700; color: var(--s-text); }
.lp-mock-price small { font-size: 12px; font-weight: 500; color: var(--s-muted); margin-left: 6px; }

.lp-mock-folder { margin-bottom: 14px; border-radius: 16px; background: var(--s-card); border: 1px solid var(--s-border); overflow: hidden; }
.lp-mock-folder > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 15px 18px; font-weight: 600; color: var(--s-text);
}
.lp-mock-folder > summary::-webkit-details-marker { display: none; }
.lp-mock-folder > summary span { display: flex; flex-direction: column; gap: 2px; }
.lp-mock-folder > summary small { font-size: 12px; font-weight: 400; color: var(--s-muted); }
.lp-mock-folder > summary em { font-style: normal; font-size: 12px; color: var(--s-muted); white-space: nowrap; }
.lp-mock-folder > summary::after { content: "⌄"; margin-left: 4px; color: var(--s-muted); transition: transform 0.15s; }
.lp-mock-folder[open] > summary::after { transform: rotate(180deg); }
.lp-mock-folder[open] > summary { border-bottom: 1px solid var(--s-border); }
.lp-mock-tests { display: flex; flex-direction: column; }
.lp-mock-folder .lp-mock-tests { padding: 4px 0; }
.lp-mock-tests:not(.lp-mock-folder .lp-mock-tests) { border-radius: 16px; background: var(--s-card); border: 1px solid var(--s-border); }
.lp-mock-test { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 18px; border-bottom: 1px solid var(--s-border); }
.lp-mock-test:last-child { border-bottom: none; }
.lp-mock-test h4 { margin: 0 0 5px; font-size: 14.5px; font-weight: 600; color: var(--s-text); }
.lp-mock-test-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--s-muted); align-items: center; }
.lp-mock-best { padding: 2px 8px; border-radius: 999px; font-weight: 700; background: rgba(245, 158, 11, 0.14); color: #b45309; }
.lp-mock-best.good { background: rgba(34, 197, 94, 0.14); color: #15803d; }
html.rg-dark .lp-mock-best { color: #fcd34d; }
html.rg-dark .lp-mock-best.good { color: #6fdc8c; }
.lp-mock-test-actions { display: flex; gap: 8px; flex-shrink: 0; }
.lp-mock-start, .lp-mock-ghost {
  cursor: pointer; border-radius: 10px; padding: 9px 16px; font-family: inherit; font-size: 13px; font-weight: 600; white-space: nowrap;
}
.lp-mock-start { border: none; background: linear-gradient(135deg, #2563eb, #1e40af); color: #fff; }
.lp-mock-ghost { border: 1px solid var(--s-border); background: transparent; color: var(--s-text); }
.lp-mock-test.is-locked { opacity: 0.7; }
.lp-mock-locked { font-size: 16px; }

/* Instructions */
.lp-mock-instr { max-width: 560px !important; }
.lp-mock-instr h3 { margin: 4px 0 14px; font-size: 20px; }
.lp-mock-instr-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.lp-mock-instr-facts div { padding: 10px; border-radius: 12px; text-align: center; background: rgba(47, 116, 224, 0.08); }
.lp-mock-instr-facts b { display: block; font-size: 20px; }
.lp-mock-instr-facts span { font-size: 11.5px; opacity: 0.75; }
.lp-mock-instr-list { margin: 0 0 14px; padding-left: 18px; font-size: 13px; line-height: 1.6; }
.lp-mock-instr-list li { margin-bottom: 4px; }
.lp-mock-instr-lang, .lp-mock-instr-ok { display: flex; align-items: center; gap: 10px; margin: 10px 0; font-size: 13.5px; font-weight: 500; }
.lp-mock-instr-lang select { padding: 7px 10px; border-radius: 8px; font-family: inherit; }
.lp-mock-instr .lp-soon2-submit:disabled { opacity: 0.5; cursor: not-allowed; }

/* Palette swatches (shared) */
.pl { display: inline-grid; place-items: center; font-style: normal; }
i.pl { width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-right: 5px; }
.pl.ans { background: #16a34a; color: #fff; }
.pl.not { background: #dc2626; color: #fff; }
.pl.nv { background: #e5e7eb; color: #374151; }
.pl.mrk { background: #7c3aed; color: #fff; }
.pl.am { background: #7c3aed; color: #fff; box-shadow: inset 0 0 0 3px #16a34a; }

/* Exam screen (full screen, still inside the portal) */
html.lp-exam-open, html.lp-exam-open body { overflow: hidden; }
#lp-exam {
  --ex-bg: #f4f7fc; --ex-card: #fff; --ex-border: #e2e8f0; --ex-text: #0b2352; --ex-muted: #5b6b8c;
  position: fixed; inset: 0; z-index: 10040; display: flex; flex-direction: column;
  background: var(--ex-bg); color: var(--ex-text); font-family: var(--font-body, inherit);
}
html.rg-dark #lp-exam { --ex-bg: #0b1220; --ex-card: #111a2c; --ex-border: #223049; --ex-text: #e6ecf7; --ex-muted: #8a98b3; }
.lp-ex-top { display: flex; align-items: center; gap: 14px; padding: 10px 18px; background: linear-gradient(135deg, #0b2352, #1e56b8); color: #fff; }
.lp-ex-logo { width: 34px; height: 34px; border-radius: 8px; }
.lp-ex-title { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.lp-ex-title small { font-size: 11px; opacity: 0.75; text-transform: uppercase; letter-spacing: 0.06em; }
.lp-ex-title b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-ex-lang { padding: 7px 10px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.12); color: inherit; font-family: inherit; font-size: 13px; }
.lp-ex-lang option { color: #0b2352; }
.lp-ex-timer { padding: 7px 14px; border-radius: 10px; background: rgba(255, 255, 255, 0.16); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 16px; min-width: 76px; text-align: center; }
.lp-ex-timer.low { background: #dc2626; animation: lpSessDot 1s infinite; }
.lp-ex-palette-btn { display: none; border: none; border-radius: 10px; padding: 8px 12px; background: rgba(255, 255, 255, 0.16); color: #fff; font-family: inherit; font-weight: 600; cursor: pointer; }
.lp-ex-body { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) 320px; min-height: 0; }
.lp-ex-main { overflow-y: auto; padding: 26px 32px; }
.lp-ex-qhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ex-border); }
.lp-ex-qhead b { font-size: 15px; }
.lp-ex-flag { font-size: 12px; font-weight: 700; color: #7c3aed; }
.lp-ex-q { font-size: 17px; line-height: 1.6; margin-bottom: 20px; white-space: pre-line; }
.lp-ex-opts { display: flex; flex-direction: column; gap: 10px; max-width: 820px; }
.lp-ex-opt {
  all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: flex-start; gap: 12px;
  padding: 13px 16px; border-radius: 12px; background: var(--ex-card); border: 1.5px solid var(--ex-border);
  font-size: 15px; line-height: 1.5; transition: border-color 0.12s, background 0.12s;
}
.lp-ex-opt:hover { border-color: #93b4ec; }
.lp-ex-opt:focus-visible { outline: 2px solid #2f74e0; outline-offset: 2px; }
.lp-ex-opt.is-picked { border-color: #2563eb; background: rgba(37, 99, 235, 0.08); }
.lp-ex-opt-key { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; background: rgba(47, 116, 224, 0.1); color: #2f74e0; }
.lp-ex-opt.is-picked .lp-ex-opt-key { background: #2563eb; color: #fff; }
.lp-ex-trans { margin-top: 12px; font-size: 12px; color: var(--ex-muted); }
.lp-ex-side { border-left: 1px solid var(--ex-border); background: var(--ex-card); padding: 18px; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; }
.lp-ex-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; font-size: 11.5px; color: var(--ex-muted); }
.lp-ex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 8px; align-content: start; }
.lp-ex-grid .pl { all: unset; box-sizing: border-box; cursor: pointer; display: grid; place-items: center; height: 38px; border-radius: 8px; font-size: 13px; font-weight: 700; }
.lp-ex-grid .pl.ans { background: #16a34a; color: #fff; }
.lp-ex-grid .pl.not { background: #dc2626; color: #fff; }
.lp-ex-grid .pl.nv { background: #e5e7eb; color: #374151; }
.lp-ex-grid .pl.mrk { background: #7c3aed; color: #fff; }
.lp-ex-grid .pl.am { background: #7c3aed; color: #fff; box-shadow: inset 0 0 0 3px #16a34a; }
.lp-ex-grid .pl.cur { outline: 3px solid #f59e0b; outline-offset: 1px; }
html.rg-dark .lp-ex-grid .pl.nv, html.rg-dark .pl.nv { background: #2a3650; color: #c9d4ea; }
.lp-ex-submit { margin-top: auto; border: none; border-radius: 12px; padding: 13px; background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-family: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.lp-ex-actions { display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--ex-card); border-top: 1px solid var(--ex-border); }
.lp-ex-spacer { flex: 1; }
.lp-ex-btn { border-radius: 10px; padding: 11px 18px; font-family: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.lp-ex-btn.ghost { border: 1px solid var(--ex-border); background: transparent; color: var(--ex-text); }
.lp-ex-btn.primary { border: none; background: linear-gradient(135deg, #2563eb, #1e40af); color: #fff; }
.lp-ex-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.lp-ex-submitting { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(4, 12, 30, 0.7); color: #fff; z-index: 2; }
.lp-ex-submitting div { text-align: center; display: flex; flex-direction: column; gap: 6px; }
.lp-ex-submitting b { font-size: 22px; }

/* Result */
.lp-res-card {
  display: flex; flex-wrap: wrap; align-items: center; gap: 28px; padding: 26px; margin-bottom: 22px; border-radius: 20px;
  background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
  --d-card: var(--s-card); --d-track: rgba(127, 145, 180, 0.22); --d-text: var(--s-text); --d-muted: var(--s-muted);
}
.lp-res-card.pass { border-color: rgba(34, 197, 94, 0.45); }
.lp-res-main { flex: 1; min-width: 260px; }
.lp-res-main h2 { margin: 4px 0 6px; font-size: 22px; color: var(--s-text); }
.lp-res-msg { margin: 0 0 14px; font-size: 14px; color: var(--s-muted); }
.lp-res-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.lp-res-stats div { min-width: 92px; padding: 10px 12px; border-radius: 12px; background: rgba(127, 145, 180, 0.1); }
.lp-res-stats b { display: block; font-size: 18px; color: var(--s-text); }
.lp-res-stats span { font-size: 11.5px; color: var(--s-muted); }
.lp-res-stats .ok b { color: #16a34a; }
.lp-res-stats .bad b { color: #dc2626; }
.lp-res-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.lp-res-actions .lp-soon2-submit { width: auto; padding-left: 22px; padding-right: 22px; }
.lp-rv-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 14px; }
.lp-rv-bar h3 { margin: 0 auto 0 0; font-size: 18px; color: var(--s-text); }
.lp-rv-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.lp-rv-filters button { cursor: pointer; border-radius: 999px; padding: 6px 12px; border: 1px solid var(--s-border); background: transparent; color: var(--s-muted); font-family: inherit; font-size: 12.5px; font-weight: 600; }
.lp-rv-filters button.on { background: #2563eb; border-color: #2563eb; color: #fff; }
.lp-rv-bar .lp-ex-lang { border-color: var(--s-border); background: var(--s-card); color: var(--s-text); }
.lp-rv-list { display: flex; flex-direction: column; gap: 12px; }
.lp-rv-q { padding: 16px 18px; border-radius: 16px; background: var(--s-card); border: 1px solid var(--s-border); border-left-width: 4px; }
.lp-rv-q.st-right { border-left-color: #16a34a; }
.lp-rv-q.st-wrong { border-left-color: #dc2626; }
.lp-rv-q.st-skip { border-left-color: #94a3b8; }
.lp-rv-q[hidden] { display: none; }
.lp-rv-qhead { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; color: var(--s-text); }
.lp-rv-badge { font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: rgba(127, 145, 180, 0.14); color: var(--s-muted); }
.st-right .lp-rv-badge:first-of-type { background: rgba(22, 163, 74, 0.14); color: #16a34a; }
.st-wrong .lp-rv-badge:first-of-type { background: rgba(220, 38, 38, 0.12); color: #dc2626; }
.lp-rv-badge.mrk { background: rgba(124, 58, 237, 0.14); color: #7c3aed; }
.lp-rv-q > p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.6; color: var(--s-text); white-space: pre-line; }
.lp-rv-opt { display: flex; align-items: center; gap: 10px; padding: 8px 10px; margin-top: 6px; border-radius: 10px; font-size: 13.5px; color: var(--s-text); border: 1px solid transparent; }
.lp-rv-opt em { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; white-space: nowrap; }
.lp-rv-opt.is-correct { background: rgba(22, 163, 74, 0.1); border-color: rgba(22, 163, 74, 0.35); }
.lp-rv-opt.is-correct em { color: #16a34a; }
.lp-rv-opt.is-correct .lp-ex-opt-key { background: #16a34a; color: #fff; }
.lp-rv-opt.is-wrong { background: rgba(220, 38, 38, 0.08); border-color: rgba(220, 38, 38, 0.3); }
.lp-rv-opt.is-wrong em { color: #dc2626; }
.lp-rv-opt.is-wrong .lp-ex-opt-key { background: #dc2626; color: #fff; }

@media (max-width: 860px) {
  .lp-ex-body { grid-template-columns: 1fr; position: relative; }
  .lp-ex-palette-btn { display: inline-block; }
  .lp-ex-side {
    position: absolute; top: 0; right: 0; bottom: 0; width: min(320px, 86vw); z-index: 3;
    transform: translateX(105%); transition: transform 0.2s ease; box-shadow: -12px 0 30px -12px rgba(0, 0, 0, 0.4);
  }
  #lp-exam.pal-open .lp-ex-side { transform: translateX(0); }
  .lp-ex-main { padding: 18px 16px 24px; }
  .lp-ex-q { font-size: 16px; }
  .lp-ex-actions { flex-wrap: wrap; gap: 8px; padding: 10px 12px; }
  .lp-ex-spacer { display: none; }
  .lp-ex-btn { flex: 1 1 calc(50% - 8px); padding: 11px 8px; font-size: 13px; }
  .lp-ex-top { gap: 8px; padding: 8px 12px; }
  .lp-ex-logo { display: none; }
  .lp-ex-lang { padding: 6px; font-size: 12px; }
  .lp-ex-timer { min-width: 0; padding: 6px 10px; font-size: 14px; }
}
@media (max-width: 640px) {
  .lp-mock-option { padding: 18px; gap: 14px; }
  .lp-mock-option-icon { width: 52px; height: 52px; font-size: 26px; }
  .lp-mock-option-label { font-size: 17px; }
  .lp-mock-test { flex-direction: column; align-items: stretch; }
  .lp-mock-test-actions .lp-mock-start { flex: 1; }
  .lp-res-card { padding: 18px; gap: 18px; }
  .lp-mock-unlock-buy { min-width: 0; width: 100%; }
}
/* Confirm / info pop-ups must sit above the full-screen exam */
#lp-confirm-overlay, #lp-info-overlay { z-index: 10100; }

/* ======================================================================
   Mock test performance dashboard
   Colours validated (dataviz validator): blue/orange pass CVD in both modes;
   grey = neutral "not answered"; every mark is also labelled (✓ ✗ –).
   ====================================================================== */
.lp-md {
  --md-c: #2a78d6; --md-w: #eb6834; --md-s: #c3c2b7; --md-grid: #e8edf5; --md-ax: #8a98b3; --md-pass: #0ca30c;
  position: relative; margin-bottom: 26px; max-width: 1240px;
}
html.rg-dark .lp-md { --md-c: #3987e5; --md-w: #d95926; --md-s: #3a4660; --md-grid: #1c2840; --md-ax: #7d8db0; --md-pass: #0ca30c; }
.lp-md-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.lp-md-head h2 { margin: 0; font-size: 20px; color: var(--s-text); }
.lp-md-head p { margin: 2px 0 0; font-size: 13px; color: var(--s-muted); }
.lp-md-filters { display: inline-flex; padding: 4px; gap: 4px; border-radius: 12px; background: var(--s-card); border: 1px solid var(--s-border); }
.lp-md-filters button {
  border: none; cursor: pointer; border-radius: 9px; padding: 7px 12px; background: transparent;
  font-family: inherit; font-size: 12.5px; font-weight: 600; color: var(--s-muted);
}
.lp-md-filters button em { font-style: normal; opacity: 0.7; margin-left: 3px; }
.lp-md-filters button.on { background: #2563eb; color: #fff; }

.lp-md-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.lp-md-kpi { padding: 14px 16px; border-radius: 16px; background: var(--s-card); border: 1px solid var(--s-border); display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lp-md-kpi b { font-size: 24px; font-weight: 700; color: var(--s-text); line-height: 1.15; }
.lp-md-kpi span { font-size: 12px; font-weight: 600; color: var(--s-muted); }
.lp-md-kpi small { font-size: 11px; color: var(--s-muted); opacity: 0.85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-md-kpi.up small { color: #15803d; opacity: 1; }
.lp-md-kpi.down small { color: #c2410c; opacity: 1; }
html.rg-dark .lp-md-kpi.up small { color: #4ade80; }
html.rg-dark .lp-md-kpi.down small { color: #fb923c; }

.lp-md-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.lp-md-card { margin: 0; padding: 16px 18px; border-radius: 18px; background: var(--s-card); border: 1px solid var(--s-border); min-width: 0; }
.lp-md-wide { grid-column: 1 / -1; }
.lp-md-card figcaption { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.lp-md-card figcaption b { font-size: 14.5px; color: var(--s-text); }
.lp-md-card figcaption span { font-size: 12px; color: var(--s-muted); }
.lp-md-chart { position: relative; min-height: 120px; }
.lp-md-chart svg { display: block; overflow: visible; }

/* line */
.lp-md .g { stroke: var(--md-grid); stroke-width: 1; }
.lp-md .ax { fill: var(--md-ax); font-size: 11px; font-family: inherit; }
.lp-md .area { fill: var(--md-c); opacity: 0.08; }
.lp-md .ln { fill: none; stroke: var(--md-c); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.lp-md .dot { fill: var(--md-c); stroke: var(--s-card); stroke-width: 2; }
.lp-md .pass { stroke: var(--md-pass); stroke-width: 1.5; stroke-dasharray: 5 4; }
.lp-md .pass-l { fill: var(--md-pass); font-size: 11px; font-weight: 700; font-family: inherit; }
.lp-md .xh { stroke: var(--md-ax); stroke-width: 1; stroke-dasharray: 3 3; }
.lp-md .hit { fill: transparent; cursor: crosshair; }

/* donut */
.lp-md-donut { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.lp-md .sl { cursor: pointer; transition: opacity 0.12s; }
.lp-md .sl:hover { opacity: 0.85; }
.lp-md .sl-c, .lp-md .sw-c { fill: var(--md-c); background: var(--md-c); }
.lp-md .sl-w, .lp-md .sw-w { fill: var(--md-w); background: var(--md-w); }
.lp-md .sl-s, .lp-md .sw-s { fill: var(--md-s); background: var(--md-s); }
.lp-md .dn-big { fill: var(--s-text); font-size: 22px; font-weight: 700; font-family: inherit; }
.lp-md .dn-sm { fill: var(--s-muted); font-size: 11px; font-family: inherit; }
.lp-md-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; flex: 1; min-width: 150px; }
.lp-md-legend li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--s-text); }
.lp-md-legend .sw { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.lp-md-legend span { flex: 1; color: var(--s-muted); }
.lp-md-legend em { font-style: normal; font-size: 12px; color: var(--s-muted); min-width: 34px; text-align: right; }

/* horizontal bars */
.lp-md-bars { display: flex; flex-direction: column; gap: 10px; }
.lp-md-bar { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) 38px; align-items: center; gap: 10px; cursor: default; }
.lp-md-bar-l { font-size: 12px; color: var(--s-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-md-bar-t { position: relative; height: 12px; border-radius: 0 4px 4px 0; background: var(--md-grid); }
.lp-md-bar-f { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 0 4px 4px 0; background: var(--md-c); opacity: 0.7; }
.lp-md-bar-f.pass { opacity: 1; }
.lp-md-bar-pass { position: absolute; top: -3px; bottom: -3px; width: 0; border-left: 1.5px dashed var(--md-pass); }
.lp-md-bar b { font-size: 12.5px; color: var(--s-text); text-align: right; }

/* vertical bars */
.lp-md-cols { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); align-items: end; gap: 4px; height: 150px; }
.lp-md-col { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding-bottom: 18px; cursor: default; }
.lp-md-col-f { width: 100%; max-width: 20px; border-radius: 4px 4px 0 0; background: var(--md-c); }
.lp-md-col-v { font-size: 10.5px; font-weight: 700; color: var(--s-text); margin-bottom: 3px; }
.lp-md-col-l { position: absolute; bottom: 0; font-size: 10.5px; color: var(--md-ax); }
.lp-md-col::after { content: ""; position: absolute; left: 0; right: 0; bottom: 17px; border-bottom: 1px solid var(--md-grid); }
.lp-md-note { margin: 10px 0 0; font-size: 12px; color: var(--s-muted); }

/* recent attempts */
.lp-md-recents { padding: 8px 8px 6px; }
.lp-md-recents-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px; padding: 8px 10px 10px; }
.lp-md-recents-head b { font-size: 14.5px; color: var(--s-text); }
.lp-md-recents-head span { font-size: 12px; color: var(--s-muted); }
.lp-md-recent { all: unset; box-sizing: border-box; cursor: pointer; width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 12px; }
.lp-md-recent:hover { background: rgba(47, 116, 224, 0.07); }
.lp-md-recent:focus-visible { outline: 2px solid #2f74e0; }
.lp-md-score { flex-shrink: 0; width: 52px; padding: 7px 0; border-radius: 10px; text-align: center; font-weight: 700; font-size: 13.5px; background: rgba(235, 104, 52, 0.12); color: #c2410c; }
.lp-md-score.pass { background: rgba(42, 120, 214, 0.12); color: #2563eb; }
html.rg-dark .lp-md-score { color: #fb923c; }
html.rg-dark .lp-md-score.pass { color: #7fb0f5; }
.lp-md-recent-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lp-md-recent-main b { font-size: 13.5px; color: var(--s-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-md-recent-main small { font-size: 11.5px; color: var(--s-muted); }
.lp-md-go { color: var(--s-muted); }

.lp-md-tip {
  position: absolute; z-index: 5; pointer-events: none; max-width: 260px;
  padding: 8px 11px; border-radius: 10px; font-size: 12px; line-height: 1.45;
  background: #0b1530; color: #e6ecf7; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, 0.6);
}
.lp-md-tip small { opacity: 0.75; }
.lp-md-empty { display: flex; align-items: center; gap: 14px; padding: 18px 20px; margin-bottom: 22px; border-radius: 16px; background: var(--s-card); border: 1px dashed var(--s-border); }
.lp-md-empty > span { font-size: 30px; }
.lp-md-empty b { color: var(--s-text); }
.lp-md-empty p { margin: 2px 0 0; font-size: 13px; color: var(--s-muted); }
.lp-mock-section-h { margin: 6px 0 12px; font-size: 16px; color: var(--s-text); }

@media (max-width: 1200px) {
  .lp-md-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lp-md-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-md-grid .lp-md-card:last-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .lp-md-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .lp-md-kpi b { font-size: 20px; }
  .lp-md-grid { grid-template-columns: 1fr; }
  .lp-md-grid .lp-md-card:last-child { grid-column: auto; }
  .lp-md-filters { width: 100%; }
  .lp-md-filters button { flex: 1; padding: 7px 6px; }
  .lp-md-card { padding: 14px; }
}
/* dashboard refinements */
.lp-md .xh { opacity: 0; }
.lp-md-bars { gap: 14px; }
.lp-md-bar { grid-template-columns: minmax(0, 1fr) 40px; grid-template-areas: "l l" "t v"; row-gap: 6px; }
.lp-md-bar-l { grid-area: l; display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; color: var(--s-text); white-space: normal; }
.lp-md-bar-l em { font-style: normal; font-size: 11px; color: var(--s-muted); white-space: nowrap; }
.lp-md-bar-t { grid-area: t; }
.lp-md-bar b { grid-area: v; }
.lp-mock-dash-wrap { margin-top: 30px; }
.lp-mock-section-h { margin-top: 0; }

/* ======================================================================
   Class sessions v4 — each session is its own card; header tinted by
   status, opened details on a contrasting panel
   ====================================================================== */
.lp-dash-sessions { background: transparent !important; border: none !important; box-shadow: none !important; overflow: visible !important; }
.lp-dash-sessions-head {
  background: var(--d-card); border: 1px solid var(--d-border); border-radius: 16px;
  margin-bottom: 12px; padding: 16px 20px !important; border-bottom: 1px solid var(--d-border) !important;
}
[data-lp-gen] { display: flex; flex-direction: column; gap: 10px; }
[data-lp-gen] > .lp-dash-sessions-head { margin-bottom: 2px; }

.lp-dash-sessions .lp-sess.lp-sess-acc {
  --st: 100, 116, 139;                       /* status colour (rgb) */
  border: 1px solid rgba(var(--st), 0.28) !important;
  border-left: 4px solid rgb(var(--st)) !important;
  border-radius: 14px; overflow: hidden;
  background: var(--d-card) !important; box-shadow: none !important;
}
.lp-sess-acc.lp-sess-done      { --st: 22, 163, 74; }
.lp-sess-acc.lp-sess-missed    { --st: 220, 38, 38; }
.lp-sess-acc.lp-sess-pending   { --st: 217, 119, 6; }
.lp-sess-acc.lp-sess-completed { --st: 100, 116, 139; }
.lp-sess-acc.lp-sess-upcoming,
.lp-sess-acc.lp-sess-scheduled { --st: 47, 116, 224; }
.lp-sess-acc.lp-sess-live      { --st: 22, 163, 74; }

/* Header: light status tint */
.lp-sess-acc > .lp-sess-head { background: rgba(var(--st), 0.08) !important; }
.lp-sess-acc > .lp-sess-head:hover { background: rgba(var(--st), 0.14) !important; }
.lp-sess-acc.is-open > .lp-sess-head { background: rgba(var(--st), 0.16) !important; border-bottom: 1px solid rgba(var(--st), 0.25); }
.lp-sess-head:focus, .lp-sess-head:focus:not(:focus-visible) { outline: none !important; box-shadow: none !important; }
.lp-sess-head:focus-visible { box-shadow: inset 0 0 0 2px rgba(var(--st), 0.7) !important; }

/* Opened details: contrasting panel */
.lp-sess-acc.is-open .lp-sess-body,
.lp-sess-acc.is-open:not(.is-next) .lp-sess-body {
  background: #eef2f8 !important;
  padding-top: 16px !important;
}
html.rg-dark .lp-sess-acc.is-open .lp-sess-body,
html.rg-dark .lp-sess-acc.is-open:not(.is-next) .lp-sess-body { background: #0a1120 !important; }
.lp-sess-body .lp-sess-info { background: var(--d-card); border-color: var(--d-border); }
html.rg-dark .lp-sess-body .lp-sess-info { background: #162238; border-color: #263552; }
.lp-sess-info-item span { color: rgb(var(--st)) !important; opacity: 0.9; }
.lp-sess-acc.lp-sess-completed .lp-sess-info-item span,
.lp-sess-acc.lp-sess-upcoming .lp-sess-info-item span { color: var(--d-muted) !important; }

/* Next / today keeps its green live look */
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next { border-color: rgba(34, 197, 94, 0.45) !important; border-left-color: #22c55e !important; }

@media (max-width: 640px) {
  [data-lp-gen] { gap: 8px; }
  .lp-dash-sessions .lp-sess.lp-sess-acc { border-radius: 12px; }
}
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-done      { --st: 22, 163, 74; }
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-missed    { --st: 220, 38, 38; }
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-pending   { --st: 217, 119, 6; }
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-completed { --st: 100, 116, 139; }
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-upcoming,
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-scheduled { --st: 47, 116, 224; }
.lp-dash-sessions .lp-sess.lp-sess-acc.lp-sess-live      { --st: 22, 163, 74; }

/* Today / next class — solid highlighted card, distinct from "done" green */
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next {
  --st: 99, 102, 241;
  border: 1.5px solid rgba(129, 140, 248, 0.75) !important;
  border-left: 1.5px solid rgba(129, 140, 248, 0.75) !important;
  box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.16), 0 18px 36px -20px rgba(79, 70, 229, 0.75) !important;
}
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next > .lp-sess-head,
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next > .lp-sess-head:hover,
.lp-dash-sessions .lp-sess.lp-sess-acc.is-next.is-open > .lp-sess-head {
  background: linear-gradient(110deg, #1d4ed8 0%, #4f46e5 55%, #7c3aed 100%) !important;
  border-bottom-color: rgba(255, 255, 255, 0.18) !important;
}
.lp-sess-acc.is-next .lp-sess-head .lp-sess-kicker,
.lp-sess-acc.is-next .lp-sess-head .lp-sess-title,
.lp-sess-acc.is-next .lp-sess-head .lp-sh-date { color: #fff !important; }
.lp-sess-acc.is-next .lp-sess-head .lp-sess-kicker { opacity: 0.8; }
.lp-sess-acc.is-next .lp-sess-head .lp-sh-chev { border-color: #fff; }
.lp-sess-acc.is-next .lp-sess-head .lp-sess-num {
  background: #fff !important; color: #4338ca !important; border-color: transparent !important;
  animation: lpTodayPulse 2s infinite;
}
.lp-sess-acc.is-next .lp-sess-kicker em { background: #fff !important; color: #4338ca !important; }
.lp-sess-acc.is-next .lp-sess-kicker em::before { background: #22c55e !important; }
.lp-sess-acc.is-next .lp-sess-pill,
html.rg-dark .lp-sess-acc.is-next .lp-sess-pill {
  background: rgba(255, 255, 255, 0.18) !important; border-color: rgba(255, 255, 255, 0.4) !important; color: #fff !important;
}
.lp-sess-acc.is-next .lp-sess-pill::before { background: #4ade80; }
.lp-sess-acc.is-next.is-open .lp-sess-body { background: rgba(99, 102, 241, 0.07) !important; }
html.rg-dark .lp-sess-acc.is-next.is-open .lp-sess-body { background: #0f1430 !important; }
.lp-sess-acc.is-next .lp-sess-info { border-color: rgba(129, 140, 248, 0.4) !important; }
.lp-sess-acc.is-next .lp-sess-info-item { border-left-color: rgba(129, 140, 248, 0.25) !important; }
.lp-sess-acc.is-next .lp-sess-info-item span { color: #6366f1 !important; }
html.rg-dark .lp-sess-acc.is-next .lp-sess-info-item span { color: #a5b4fc !important; }
@keyframes lpTodayPulse {
  0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
  70% { box-shadow: 0 0 0 9px rgba(255, 255, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}
@media (prefers-reduced-motion: reduce) { .lp-sess-acc.is-next .lp-sess-head .lp-sess-num { animation: none; } }

/* "Study Material" wrapper card — holds the four study sections, opens on click */
.sidebar-bundle {
  margin: 6px 0 4px; border-radius: 16px;
  background: linear-gradient(160deg, rgba(47, 116, 224, 0.10), rgba(124, 92, 255, 0.06));
  border: 1px solid rgba(47, 116, 224, 0.28);
}
html.rg-dark .sidebar-bundle { background: linear-gradient(160deg, rgba(57, 135, 229, 0.12), rgba(124, 92, 255, 0.07)); border-color: rgba(110, 163, 245, 0.28); }
.sidebar-bundle-head {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 15px;
}
.sidebar-bundle-head::-webkit-details-marker { display: none; }
.sidebar-bundle-head:hover { background: rgba(47, 116, 224, 0.08); }
.sidebar-bundle-head:focus { outline: none; }
.sidebar-bundle-head:focus-visible { outline: 2px solid rgba(47, 116, 224, 0.6); outline-offset: -2px; }
.sidebar-bundle-ico {
  flex-shrink: 0; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center;
  background: linear-gradient(135deg, #2f74e0, #7c5cff); color: #fff;
  box-shadow: 0 6px 14px -8px rgba(47, 116, 224, 0.9);
}
.sidebar-bundle-title { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 14px; font-weight: 600; color: #0b2352; }
html.rg-dark .sidebar-bundle-title { color: #e6ecf7; }
.sidebar-bundle-title small { font-size: 11px; font-weight: 500; color: #8ea0bf; }
.sidebar-bundle-head .sidebar-group-chev { color: #2f74e0; }
html.rg-dark .sidebar-bundle-head .sidebar-group-chev { color: #7fb0f5; }
.sidebar-bundle[open] > .sidebar-bundle-head .sidebar-group-chev { transform: rotate(180deg); }
.sidebar-bundle[open] > .sidebar-bundle-head { border-bottom: 1px solid rgba(47, 116, 224, 0.18); border-radius: 15px 15px 0 0; }
.sidebar-bundle-body { padding: 4px 6px 6px; display: flex; flex-direction: column; gap: 2px; }
.sidebar-bundle-body .sidebar-card { margin: 4px 0; }

/* Study Material card — cleaner, single-line header aligned with menu items */
.sidebar-bundle { margin: 6px 0; border-radius: 14px; }
.sidebar-bundle-head { gap: 10px; padding: 8px 10px 8px 8px; min-height: 52px; border-radius: 13px; }
.sidebar-bundle-ico { width: 34px; height: 34px; border-radius: 10px; }
.sidebar-bundle-title { gap: 1px; font-size: 13.5px; line-height: 1.25; }
.sidebar-bundle-title small { font-size: 10.5px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: 0.01em; }
.sidebar-bundle-head .sidebar-group-chev {
  flex-shrink: 0; width: 24px; height: 24px; padding: 4px; border-radius: 8px;
  background: rgba(47, 116, 224, 0.12); box-sizing: border-box;
}
/* no thick focus box after a mouse click */
.sidebar-bundle-head:focus, .sidebar-bundle-head:focus-visible, .sidebar-bundle:focus-within { outline: none !important; box-shadow: none !important; }
.sidebar-bundle-head:focus-visible { box-shadow: inset 0 0 0 2px rgba(47, 116, 224, 0.5) !important; }
.sidebar-bundle[open] > .sidebar-bundle-head { border-radius: 13px 13px 0 0; }

/* Study Material button inside the training card */
.lp-dash-studybtn {
  all: unset; box-sizing: border-box; cursor: pointer;
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 12px 14px; border-radius: 14px;
  background: linear-gradient(120deg, rgba(224, 185, 92, 0.22), rgba(224, 185, 92, 0.08));
  border: 1px solid rgba(224, 185, 92, 0.45);
  transition: transform 0.12s, background 0.15s;
}
.lp-dash-studybtn:hover { transform: translateY(-1px); background: linear-gradient(120deg, rgba(224, 185, 92, 0.3), rgba(224, 185, 92, 0.12)); }
.lp-dash-studybtn:focus-visible { outline: 2px solid #e0b95c; outline-offset: 2px; }
.lp-dash-studybtn-ico { flex-shrink: 0; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 20px; background: rgba(255, 255, 255, 0.14); }
.lp-dash-studybtn-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.lp-dash-studybtn-text b { font-size: 14.5px; color: #fff; }
.lp-dash-studybtn-text small { font-size: 11.5px; color: rgba(230, 239, 255, 0.75); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-dash-studybtn-go {
  flex-shrink: 0; padding: 8px 14px; border-radius: 10px; font-size: 13px; font-weight: 700;
  background: linear-gradient(135deg, #e0b95c, #c99a3a); color: #1d1503;
}
/* brief highlight on the menu card when opened from the dashboard */
.sidebar-bundle.lp-flash { animation: lpBundleFlash 1.4s ease; }
@keyframes lpBundleFlash { 0%, 60% { box-shadow: 0 0 0 3px rgba(224, 185, 92, 0.8); } 100% { box-shadow: 0 0 0 0 rgba(224, 185, 92, 0); } }
@media (max-width: 640px) {
  .lp-dash-studybtn { padding: 10px 12px; gap: 10px; }
  .lp-dash-studybtn-ico { width: 34px; height: 34px; font-size: 18px; }
  .lp-dash-studybtn-go { padding: 7px 10px; font-size: 12px; }
}
.lp-att-done b { display: block; font-size: 1.12em; margin-bottom: 2px; }

/* ======================================================================
   Certificates — dashboard strip + My Certificates page
   ====================================================================== */
.lp-dash-next.lp-cert-strip { gap: 14px; }
.lp-cert-strip-ico { flex-shrink: 0; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; background: rgba(255, 255, 255, 0.12); }
.lp-dash-next.lp-cert-strip .lp-dash-next-text { flex: 1; }
.lp-dash-next.lp-cert-strip.is-ready {
  background: linear-gradient(120deg, rgba(224, 185, 92, 0.28), rgba(224, 185, 92, 0.08)) !important;
  border: 1px solid rgba(224, 185, 92, 0.55) !important;
}
.lp-dash-next.lp-cert-strip.is-ready .lp-cert-strip-ico { background: linear-gradient(135deg, #e0b95c, #c99a3a); }
.lp-dash-next.lp-cert-strip.is-ready .lp-dash-next-value { font-size: 16px; }

.lp-cert-list { display: flex; flex-direction: column; gap: 18px; max-width: 1100px; }
.lp-cert-card {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 26px; align-items: center;
  padding: 20px; border-radius: 20px; background: var(--s-card); border: 1px solid var(--s-border); box-shadow: var(--s-shadow);
}
.lp-cert-preview {
  position: relative; display: block; border-radius: 12px; overflow: hidden; aspect-ratio: 1.414 / 1;
  background: linear-gradient(135deg, #fdf6e3, #f3e3b5); border: 1px solid rgba(201, 154, 58, 0.45);
  box-shadow: 0 18px 36px -24px rgba(0, 0, 0, 0.6); transition: transform 0.15s;
}
.lp-cert-preview:hover { transform: translateY(-2px); }
.lp-cert-preview img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.lp-cert-fallback { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 8px; font-size: 44px; color: #7a5a12; text-align: center; }
.lp-cert-fallback b { font-size: 15px; }
.lp-cert-info { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-width: 0; }
.lp-cert-badge { padding: 4px 11px; border-radius: 999px; font-size: 12px; font-weight: 700; background: rgba(22, 163, 74, 0.14); color: #15803d; }
html.rg-dark .lp-cert-badge { color: #6fdc8c; }
.lp-cert-info h3 { margin: 0; font-size: 19px; line-height: 1.35; color: var(--s-text); }
.lp-cert-info dl { margin: 0; display: grid; grid-template-columns: 1fr; gap: 8px; width: 100%; }
.lp-cert-info dl div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 10px; background: rgba(127, 145, 180, 0.08); }
.lp-cert-info dt { font-size: 12px; color: var(--s-muted); }
.lp-cert-info dd { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--s-text); text-align: right; }
.lp-cert-actions { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; margin-top: 4px; }
.lp-cert-actions .lp-cert-dl { width: auto; flex: 1 1 100%; text-align: center; text-decoration: none; background: linear-gradient(135deg, #e0b95c, #c99a3a) !important; color: #1d1503 !important; }
.lp-cert-actions .lp-cert-view { flex: 1 1 0; text-align: center; text-decoration: none; }
.lp-cert-empty p { line-height: 1.6; }
@media (max-width: 860px) {
  .lp-cert-card { grid-template-columns: 1fr; gap: 16px; padding: 14px; }
  .lp-dash-next.lp-cert-strip .lp-dash-next-actions { width: 100%; }
  .lp-dash-next.lp-cert-strip .lp-dash-next-actions .lp-dash-btn { flex: 1 1 auto; }
}

/* My Certificates v3 — full width; certificate on one side, details on the other */
.lp-cert-list { max-width: none; }
.lp-cert-card {
  grid-template-columns: minmax(0, 600px) minmax(0, 1fr); gap: 32px; align-items: start;
  padding: 24px;
}
.lp-cert-frame { position: relative; min-height: 420px; border-radius: 14px; overflow: hidden; background: transparent; }
.lp-cert-frame iframe { display: block; width: 100%; height: 860px; border: 0; background: transparent; color-scheme: light; opacity: 0; transition: opacity 0.25s; }
.lp-cert-frame.is-loaded iframe { opacity: 1; }
.lp-cert-frame-loading { position: absolute; inset: 0; display: grid; place-items: center; font-size: 13px; color: #9aa8c4; border-radius: 14px; background: rgba(127, 145, 180, 0.08); }
.lp-cert-frame.is-loaded .lp-cert-frame-loading { display: none; }
.lp-cert-info { position: sticky; top: 24px; gap: 14px; padding-top: 4px; }
.lp-cert-info h3 { font-size: 24px; line-height: 1.3; }
.lp-cert-lead { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--s-muted); }
.lp-cert-info dl { grid-template-columns: 1fr; gap: 10px; }
.lp-cert-info dl div { flex-direction: row; justify-content: space-between; align-items: center; padding: 13px 16px; border-radius: 12px; }
.lp-cert-info dt { font-size: 13px; }
.lp-cert-info dd { font-size: 15px; text-align: right; }
.lp-cert-tip {
  display: flex; gap: 10px; align-items: flex-start; margin: 2px 0 0; padding: 12px 14px; width: 100%; box-sizing: border-box;
  border-radius: 12px; font-size: 13px; line-height: 1.55; color: var(--s-text);
  background: rgba(224, 185, 92, 0.12); border: 1px solid rgba(224, 185, 92, 0.35);
}
.lp-cert-tip > span:first-child { font-weight: 700; color: #c99a3a; }
.lp-cert-actions { gap: 10px; }
.lp-cert-actions .lp-cert-view { flex: 1 1 0; min-width: 160px; padding: 12px 16px; text-align: center; }
.lp-cert-actions .lp-cert-li { background: #0a66c2 !important; border-color: #0a66c2 !important; color: #fff !important; }
@media (max-width: 1100px) {
  .lp-cert-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 760px) {
  .lp-cert-card { grid-template-columns: 1fr; gap: 18px; padding: 12px; border-radius: 16px; }
  .lp-cert-frame { min-height: 300px; }
  .lp-cert-frame iframe { height: 560px; }
  .lp-cert-info { position: static; padding: 4px 6px 6px; }
  .lp-cert-info h3 { font-size: 19px; }
  .lp-cert-lead { font-size: 13.5px; }
  .lp-cert-info dl div { padding: 11px 13px; }
  .lp-cert-info dd { font-size: 14px; }
  .lp-cert-actions { flex-direction: column; }
  .lp-cert-actions .lp-cert-view { min-width: 0; width: 100%; box-sizing: border-box; }
}

/* Dashboard certificate strip v2 — celebratory card with confetti */
.lp-dash-next.lp-cert-strip.is-ready {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px;
  padding: 18px 20px; border-radius: 16px;
  background: radial-gradient(120% 140% at 0% 0%, #7c3aed 0%, #5b21b6 38%, #3b0f7a 70%, #2a0a5c 100%) !important;
  border: 1px solid rgba(255, 214, 120, 0.65) !important;
  box-shadow: 0 0 0 1px rgba(255, 214, 120, 0.15) inset, 0 18px 40px -18px rgba(124, 58, 237, 0.75);
}
.lp-cert-strip.is-ready > *:not(.lp-cs-confetti):not(.lp-cs-shine) { position: relative; z-index: 2; }
.lp-cs-medal {
  display: grid; place-items: center; width: 60px; height: 60px; border-radius: 18px;
  background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 230, 160, 0.35);
  animation: lpCsBob 3s ease-in-out infinite;
}
.lp-cs-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lp-cs-label { font-size: 10.5px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: #ffd98a; }
.lp-cs-title { font-size: 19px; font-weight: 700; line-height: 1.25; color: #fff; }
.lp-cs-sub { font-size: 12.5px; color: rgba(255, 255, 255, 0.78); }
.lp-cs-sub b { color: #fff; font-weight: 600; }
.lp-cs-btn {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  padding: 12px 18px; border-radius: 12px; font-size: 14px; font-weight: 700; text-decoration: none;
  color: #2a1600 !important; background: linear-gradient(135deg, #ffe7a3, #e0b95c 55%, #c99a3a);
  box-shadow: 0 8px 20px -8px rgba(255, 200, 90, 0.9); transition: transform 0.15s, box-shadow 0.15s;
}
.lp-cs-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 26px -8px rgba(255, 200, 90, 1); }
.lp-cs-btn span { transition: transform 0.15s; }
.lp-cs-btn:hover span { transform: translateX(3px); }
.lp-cs-confetti { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.lp-cs-confetti i {
  position: absolute; top: -12px; width: 7px; height: 12px; border-radius: 2px; opacity: 0;
  animation-name: lpCsFall; animation-timing-function: linear; animation-iteration-count: infinite;
}
.lp-cs-shine {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.16) 48%, transparent 60%);
  transform: translateX(-100%); animation: lpCsShine 4.5s ease-in-out infinite;
}
@keyframes lpCsFall {
  0% { transform: translateY(0) rotate(0); opacity: 0; }
  10% { opacity: 0.95; }
  85% { opacity: 0.9; }
  100% { transform: translateY(170px) rotate(var(--rot, 180deg)); opacity: 0; }
}
@keyframes lpCsShine { 0%, 55% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
@keyframes lpCsBob { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-3px) rotate(3deg); } }
@media (prefers-reduced-motion: reduce) {
  .lp-cs-confetti, .lp-cs-shine { display: none; }
  .lp-cs-medal { animation: none; }
}
*:has(> .lp-cert-strip.is-ready) { container-type: inline-size; }
@container (max-width: 600px) {
  .lp-dash-next.lp-cert-strip.is-ready { grid-template-columns: auto minmax(0, 1fr); }
  .lp-cs-btn { grid-column: 1 / -1; justify-content: center; }
}
@media (max-width: 520px) {
  .lp-dash-next.lp-cert-strip.is-ready { gap: 12px; padding: 14px; }
  .lp-cs-medal { width: 50px; height: 50px; border-radius: 14px; }
  .lp-cs-medal svg { width: 36px; height: 36px; }
  .lp-cs-title { font-size: 17px; }
}

/* Sidebar prices — price for everyone, crossed out when free (enrolled) or bought */
.sidebar-link .lp-nav-price {
  margin-left: auto; flex-shrink: 0; display: inline-flex; flex-direction: column; align-items: flex-end; gap: 1px;
  line-height: 1.1; font-size: 11px; font-weight: 700;
}
.lp-nav-price b { font-weight: 700; }
.lp-nav-price.is-paid b {
  padding: 3px 8px; border-radius: 999px; font-size: 11px;
  background: rgba(245, 158, 11, 0.14); color: #b45309;
}
html.rg-dark .lp-nav-price.is-paid b { background: rgba(245, 158, 11, 0.18); color: #fcd34d; }
.lp-nav-price s { font-size: 10.5px; font-weight: 600; color: var(--s-muted, #8a96ad); text-decoration-thickness: 1.5px; text-decoration-color: #ef4444; }
.lp-nav-price.is-free b, .lp-nav-price.is-owned b {
  padding: 2px 7px; border-radius: 999px; font-size: 10px; letter-spacing: 0.04em;
  background: rgba(22, 163, 74, 0.16); color: #15803d;
}
html.rg-dark .lp-nav-price.is-free b, html.rg-dark .lp-nav-price.is-owned b { background: rgba(34, 197, 94, 0.18); color: #6fdc8c; }
.sidebar-card-badge.lp-nav-badge s { opacity: 0.75; margin-right: 2px; text-decoration-thickness: 1.5px; }
.sidebar-card-badge.lp-nav-badge.is-paid { background: linear-gradient(135deg, #e0b95c, #c99a3a) !important; color: #1d1503 !important; }
.lp-mock-chip s { opacity: 0.7; margin-right: 3px; text-decoration-thickness: 1.5px; text-decoration-color: #ef4444; }

/* Mock hub — explicit start buttons */
.lp-mock-option { align-items: flex-start; }
.lp-mock-option-cta {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: 12px;
  padding: 11px 18px; border-radius: 12px; font-size: 14px; font-weight: 700; line-height: 1.3;
  background: #fff; box-shadow: 0 8px 18px -10px rgba(0, 0, 0, 0.6); transition: transform 0.15s;
}
.lp-mock-unit .lp-mock-option-cta { color: #1e56b8; }
.lp-mock-exam .lp-mock-option-cta { color: #6d28d9; }
.lp-mock-option-cta span { transition: transform 0.15s; }
.lp-mock-option:hover .lp-mock-option-cta span { transform: translateX(3px); }
@media (max-width: 560px) {
  .lp-mock-option-cta { align-self: stretch; justify-content: center; text-align: center; }
}

/* Government-information disclaimer + official sources (Google Play Misleading Claims policy) */
.lp-gov-note {
  display: flex; gap: 12px; margin: 0 0 18px; padding: 14px 16px; border-radius: 14px;
  background: rgba(59, 130, 246, 0.08); border: 1px solid rgba(59, 130, 246, 0.3); color: var(--s-text);
  font-size: 13.5px; line-height: 1.55;
}
.lp-gov-note-ico { font-size: 18px; line-height: 1.3; }
.lp-gov-note p { margin: 0 0 6px; }
.lp-gov-note ul { margin: 0 0 8px; padding-left: 18px; }
.lp-gov-note li { margin: 2px 0; }
.lp-gov-note a { color: #2563eb; font-weight: 600; text-decoration: underline; word-break: break-word; }
html.rg-dark .lp-gov-note a { color: #8ab4ff; }
.lp-gov-note-small { font-size: 12px; color: var(--s-muted); margin: 0 !important; }
.lp-gov-footer {
  display: block; clear: both; margin: 36px 0 8px; padding: 14px 16px; border-radius: 12px;
  font-size: 12px; line-height: 1.6; color: var(--s-muted, #6b7a99);
  background: rgba(127, 145, 180, 0.08); border: 1px solid rgba(127, 145, 180, 0.18);
}
.lp-gov-footer b { color: var(--s-text, #14213d); }
.lp-gov-footer a { color: #2563eb; text-decoration: underline; }
html.rg-dark .lp-gov-footer a { color: #8ab4ff; }
.auth-shell { flex-direction: column; }
.lp-gov-footer-auth { max-width: 440px; margin: 18px auto 0; color: rgba(220, 230, 250, 0.75); background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.12); }
.lp-gov-footer-auth b { color: #fff; }
.lp-gov-footer-auth a { color: #8ab4ff; }
.lp-gov-footer b { color: #14213d; }
html.rg-dark .lp-gov-footer { color: #9aa8c4; }
html.rg-dark .lp-gov-footer b { color: #e6edf7; }