/* -------- Fancy QC user badge -------- */
.qc-user-badge{ --qc-accent:#7c3aed; /* <— change this to set the theme color */
  display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px;
  background:linear-gradient(180deg,#ffffff 0%,#f7f8ff 100%); border:1px solid #e9ecf5;
  box-shadow:0 10px 24px rgba(16,24,40,.06);
}
.qc-user-avatar{ width:48px; height:48px; border-radius:50%; outline:3px solid var(--qc-accent); outline-offset:2px; box-shadow:0 6px 14px rgba(124,58,237,.25); }
.qc-user-lines{line-height:1.15}
.qc-user-name{font-weight:700; letter-spacing:.2px}
.qc-user-points,.qc-user-streak{font-size:12px; color:#56607a}
.qc-user-points::before{content:"🏆 "; }
.qc-user-streak::before{content:"🔥 "; }
.qc-user-login,.qc-user-logout{
  margin-left:auto; padding:8px 12px; border-radius:999px; background:var(--qc-accent); color:#fff !important;
  text-decoration:none; box-shadow:0 10px 18px rgba(124,58,237,.35); transition:transform .12s ease, box-shadow .12s ease, opacity .2s;
}
.qc-user-login:hover,.qc-user-logout:hover{ transform:translateY(-1px) }
.qc-user-login:active,.qc-user-logout:active{ transform:translateY(0) scale(.98) }

@media (prefers-color-scheme: dark){
  .qc-user-badge{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); color:#e6e8f0; box-shadow:none; }
  .qc-user-points,.qc-user-streak{ color:#cfd6e6 }
}

/* Container */
.qc-leaderboard, .qc-streakboard{ font-size:15px }

/* Table shell */
.qc-leaderboard-table{
  width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:14px;
  background:#fff; box-shadow:0 10px 24px rgba(16,24,40,.06); border:1px solid #e9ecf5;
}
.qc-leaderboard-table thead th{ background:linear-gradient(135deg,#6366f1,#7c3aed); color:#fff; border:none; padding:10px; }
.qc-leaderboard-table tbody td{ padding:10px; border-top:1px solid #eef2ff }
.qc-leaderboard-table tbody tr:nth-child(odd){ background:#fafbff }
.qc-leaderboard-table td:first-child{ font-weight:700; text-align:center; width:56px }

/* (Removed the extra trophy to avoid duplicate with medals)
.qc-leaderboard-table tbody tr:first-child td:first-child::after{ content:" 🏆"; }
*/

/* Section headers */
.qc-leaderboard-header, .qc-streakboard-header{ margin:12px 0 8px; font-weight:700; }

/* --- Login banner polish ------------------------------------------- */
/* Base */
.qc-login-prompt{
  display:flex; align-items:center; gap:.6rem; padding:.75rem .9rem; border:1px solid #e6ebf2; border-radius:10px;
  background:#f7f9fe; /* default (guest) */ box-shadow:0 1px 0 rgba(0,0,0,.03); animation:qcSlideIn .25s ease-out; line-height:1.35;
}
.qc-login-prompt .qc-login-icon{
  width:22px;height:22px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px;
  font-size:13px; color:#0d6efd; background:rgba(13,110,253,.12);
}
/* Guest state (shows CTA) */
.qc-login-prompt:not(:has(.qc-login-ok)){ background:#f2f6ff; border-color:#cfe0ff; }
.qc-login-prompt:not(:has(.qc-login-ok)) .qc-login-link{
  margin-left:.5rem; padding:.35rem .7rem; border-radius:999px; background:#0d6efd; color:#fff; text-decoration:none; font-weight:600;
}
.qc-login-prompt:not(:has(.qc-login-ok)) .qc-login-link:hover{ filter:brightness(.95); }
.qc-login-prompt:not(:has(.qc-login-ok)) .qc-login-link:focus{ outline:2px solid #0d6efd33; outline-offset:2px; }
/* Signed-in state */
.qc-login-prompt:has(.qc-login-ok){ background:#f1fbf5; border-color:#cfeadd; }
.qc-login-prompt:has(.qc-login-ok) .qc-login-icon{ color:#1e7e34; background:#1e7e3420; }

/* Small entrance animation */
@keyframes qcSlideIn{ from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:translateY(0)} }

/* --- Fix mobile wrapping for the Sign in CTA --- */
.qc-login-prompt { flex-wrap: wrap; }
.qc-login-prompt .qc-login-link{
  white-space: nowrap; /* keep "Sign in" on one line */
  flex: 0 0 auto; /* don't let flexbox shrink it */
  display: inline-flex; align-items: center; justify-content: center;
}
/* --- Optional: nicer layout on very narrow screens --- */
@media (max-width: 420px){
  .qc-login-prompt .qc-login-link{ margin-left: 0; margin-top: .4rem; width: 100%; text-align: center; }
}

/* === QC Share Strip – high-contrast labels === */
.qc-share-strip { background:#fff; } /* whiter base so pills pop */
.qc-share-btn{ font-weight:700; font-size:14.5px; padding:8px 14px; line-height:1.1; border-radius:10px; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; }
.qc-share-btn span, .qc-share-btn svg { color:inherit; }
/* Force white labels on brand backgrounds */
.qc-share-fb, .qc-share-li, .qc-share-wa { color:#fff !important; }
/* Subtle shadow so buttons stand out on gradients */
.qc-share-btn { box-shadow:0 1px 0 rgba(0,0,0,.05); }
.qc-share-btn:hover { transform:translateY(-1px); opacity:1; }
/* Make copy pill match the set a bit more */
.qc-share-copy { background:#111827; color:#fff; border-color:#111827; }
.qc-share-copy.copied { background:#16a34a; border-color:#16a34a; color:#fff; }
/* Tighten wrap on small screens */
@media (max-width:520px){ .qc-share-btn { font-size:14px; padding:8px 12px; } }

/* Motivation bar – mobile layout */
.qc-motivstrip{
  display:flex; gap:8px; align-items:center; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:6px 8px; margin:6px 0; scrollbar-width:none;
}
.qc-motivstrip::-webkit-scrollbar{ display:none; }
.qc-chip{ white-space:nowrap; background:#fff; border:1px solid #e5e7eb; border-radius:9999px; padding:7px 10px; line-height:1; box-shadow:0 1px 2px rgba(0,0,0,.04); font-size:13px; }
.qc-chip em{ color:#6b7280; }
@media (max-width: 480px){ .qc-chip em{ display:none; } /* show just the numbers on very small screens */ }

/* Medals in the rank column */
.qc-leaderboard-table tbody tr:nth-child(1) td:first-child::before{ content:"🥇 "; }
.qc-leaderboard-table tbody tr:nth-child(2) td:first-child::before{ content:"🥈 "; }
.qc-leaderboard-table tbody tr:nth-child(3) td:first-child::before{ content:"🥉 "; }

/* Subtle background tints */
.qc-leaderboard-table tbody tr:nth-child(1){ background:#fff8e6; }
.qc-leaderboard-table tbody tr:nth-child(2){ background:#f3f4ff; }
.qc-leaderboard-table tbody tr:nth-child(3){ background:#f2fbf6; }

/*Sticky table header (nice for long lists)*/
.qc-leaderboard-table thead th{ position: sticky; top: 0; z-index: 1; }

/*Tighten spacing on mobile*/
@media (max-width: 520px){
  .qc-leaderboard-table th, .qc-leaderboard-table td{ padding:8px; }
  .qc-leaderboard, .qc-streakboard{ font-size:14px; }
}

/*Right-align numeric columns*/
.qc-leaderboard-table th:nth-child(3), .qc-leaderboard-table td:nth-child(3){ text-align:right; }

/* Ensure our skin wins against theme defaults */
.qc-leaderboard .qc-leaderboard-table, .qc-streakboard .qc-leaderboard-table{
  border-radius:14px !important; background:#fff !important; box-shadow:0 10px 24px rgba(16,24,40,.06) !important;
  border:1px solid #e9ecf5 !important; border-collapse:separate !important; border-spacing:0 !important;
}
.qc-leaderboard .qc-leaderboard-table thead th, .qc-streakboard .qc-leaderboard-table thead th{
  background:linear-gradient(135deg,#6366f1,#7c3aed) !important; color:#fff !important; border:none !important; padding:10px !important;
}
.qc-leaderboard .qc-leaderboard-table tbody td, .qc-streakboard .qc-leaderboard-table tbody td{
  padding:10px !important; border-top:1px solid #eef2ff !important;
}
.qc-leaderboard .qc-leaderboard-table tbody tr:nth-child(odd), .qc-streakboard .qc-leaderboard-table tbody tr:nth-child(odd){
  background:#fafbff !important;
}

/* === Prominent “Scores” menu entry (desktop + mobile) =================== */
a[data-qc-scores], a.qc-nav-scores{
  display:inline-flex; align-items:center; gap:8px; font-weight:700; text-decoration:none; line-height:1.15; padding:8px 10px; border-radius:10px;
}
a[data-qc-scores]::before, a.qc-nav-scores::before{ content:"🏆"; display:inline-block; font-size:14px; line-height:1; }
/* Desktop dropdown look (fits your qc-header-auth dropdown) */
.qc-dropdown a[data-qc-scores], .qc-dropdown a.qc-nav-scores{ color:#111827; }
.qc-dropdown a[data-qc-scores]:hover, .qc-dropdown a.qc-nav-scores:hover{ background:#eef2ff; color:#3730a3; }
/* Mobile-friendly pill */
@media (max-width: 782px){
  a[data-qc-scores], a.qc-nav-scores{ background:#eef2ff; color:#1f2937; border:1px solid #c7d2fe; padding:10px 12px; border-radius:12px; }
}
/* Dark mode adjustments */
@media (prefers-color-scheme: dark){
  .qc-dropdown a[data-qc-scores], .qc-dropdown a.qc-nav-scores{ color:#e5e7eb; }
  .qc-dropdown a[data-qc-scores]:hover, .qc-dropdown a.qc-nav-scores:hover{ background:#1b1533; color:#c7b9ff; }
  @media (max-width: 782px){
    a[data-qc-scores], a.qc-nav-scores{ background:#1b1533; color:#e5e7eb; border-color:#2e2361; }
  }
}

/* QC Toasts: force the chosen position to win */
.qc-toast-root.qc-pos-tc, .qc-toast-root.qc-pos-tr, .qc-toast-root.qc-pos-tl { bottom: auto !important; }
.qc-toast-root.qc-pos-bc, .qc-toast-root.qc-pos-br, .qc-toast-root.qc-pos-bl { top: auto !important; }

/* Leaderboard & Streakboard: mobile polish */
@media (max-width: 480px){
  .qc-leaderboard, .qc-streakboard { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .qc-leaderboard table, .qc-streakboard table { min-width: 340px; }
  .qc-leaderboard-table th:nth-child(1), .qc-leaderboard-table td:nth-child(1){ width:32px; }
  .qc-av{ width:24px; height:24px; }
  .qc-tag{ display:none; } /* hide handle on very small screens */
  .qc-find-me{ padding:8px 10px; } /* comfy tap target */
}

/* Optional: subtle zebra for readability (keeps highlight visible) */
.qc-leaderboard-table tbody tr:nth-child(odd):not(.qc-highlight):not(.qc-me-outside),
.qc-leaderboard-table tbody tr:nth-child(odd):not(.is-you):not(.qc-me-outside){ background: #fafafa; }

/* Leaderboard "Find me" highlight — WebKit-safe (iOS Safari/Chrome, Edge) */
.qc-leaderboard-table tr.qc-highlight > td,
.qc-streakboard .qc-leaderboard-table tr.qc-highlight > td {
  background-color: #fff7cc !important; /* use cell backgrounds, not <tr> */
}

/* Make sure highlight mode suppresses zebra/podium paints on non-highlight rows (matches plugin JS .qc-find-active) */
.qc-leaderboard.qc-find-active .qc-leaderboard-table tbody tr:not(.qc-highlight),
.qc-streakboard.qc-find-active .qc-leaderboard-table tbody tr:not(.qc-highlight){
  background: transparent !important;
  background-image: none !important;
}
.qc-leaderboard.qc-find-active .qc-leaderboard-table tbody tr:not(.qc-highlight) td,
.qc-streakboard.qc-find-active .qc-leaderboard-table tbody tr:not(.qc-highlight) td{
  background: transparent !important;
  background-image: none !important;
}

/* Ensure the preview "me" row styling always shows even if zebra/podium rules exist elsewhere */
.qc-me-outside td{ background:#f8fafc !important; }
.qc-leaderboard-table tbody tr.qc-me-outside td:first-child::before,
.qc-streakboard .qc-leaderboard-table tbody tr.qc-me-outside td:first-child::before{
  content: none !important;
}

/* (Optional) smoother fade on supported browsers */
.qc-leaderboard-table td { transition: background-color .25s ease; }


/* Trophy next to the winner's name; hides on very small screens */
.qc-leaderboard-table tbody tr:nth-child(1) td:nth-child(2) .qc-name::after{
  content:"🏆";
  display:inline-block;
  margin-left:6px;
  font-size:14px;
  opacity:.85;
}
@media (max-width:480px){
  .qc-leaderboard-table tbody tr:nth-child(1) td:nth-child(2) .qc-name::after{ display:none; }
}








