/**
 * Course review discoverability — hero rating pill, redesigned Reviews-tab
 * empty state, and the sidebar "Rate this course" / review carousel card.
 * Only enqueued on single course pages — see functions.php.
 */
:root {
    --lcu-navy:    #0c2a5c;
    --lcu-navy-mid:#1c3c70;
    --lcu-blue:    #2563eb;
    --lcu-accent:  #6246ea;
    --lcu-amber:   #f59e0b;
    --lcu-text:    #1e293b;
    --lcu-muted:   #64748b;
    --lcu-faint:   #94a3b8;
    --lcu-border:  #e2e8f0;
    --lcu-bg:      #f8fafc;
    --lcu-green:   #16a34a;
    --lcu-green-tint: #f0fdf4;
}

/* ── 1. Hero rating — clickable, with a "no reviews yet" nudge ─────────────── */
.tutor-course-details-ratings.lcu-clickable-rating {
    cursor: pointer; display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.lcu-review-cta {
    font-size: 13px; font-weight: 600; color: var(--lcu-blue);
    text-decoration: underline; text-underline-offset: 2px;
}

/* ── 2. Reviews-tab empty state ─────────────────────────────────────────────── */
.lcu-reviews-empty {
    text-align: center; padding: 48px 24px; background: var(--lcu-bg);
    border: 1px dashed var(--lcu-border); border-radius: 14px;
}
.lcu-reviews-empty .lcu-re-stars { color: var(--lcu-border); font-size: 28px; letter-spacing: 6px; margin-bottom: 16px; }
.lcu-reviews-empty h4 { font-size: 17px; font-weight: 700; margin: 0 0 8px; color: var(--lcu-text); }
.lcu-reviews-empty p { font-size: 14px; color: var(--lcu-muted); margin: 0 0 22px; max-width: 42ch; margin-left: auto; margin-right: auto; }

/* ── 3. Sidebar: rate-card + carousel ───────────────────────────────────────── */
.lcu-rate-card {
    margin-top: 20px; border: 1.5px solid var(--lcu-green); background: var(--lcu-green-tint);
    border-radius: 12px; padding: 22px; text-align: center;
}
.lcu-rate-card h5 { margin: 0 0 4px; font-size: 14.5px; font-weight: 700; color: var(--lcu-text); }
.lcu-rate-card p { margin: 0 0 16px; font-size: 12.5px; color: var(--lcu-muted); line-height: 1.5; }
.lcu-rate-card .lcu-rc-stars { color: var(--lcu-amber); font-size: 22px; letter-spacing: 4px; margin-bottom: 16px; }
.lcu-rate-card button {
    width: 100%; background: var(--lcu-green); color: #fff; border: none;
    font: inherit; font-weight: 700; font-size: 13.5px; padding: 11px; border-radius: 8px; cursor: pointer;
}
.lcu-rate-card button:hover { background: #15803d; }

.lcu-review-carousel {
    margin-top: 20px; border: 1px solid var(--lcu-border); background: #fff;
    border-radius: 12px; padding: 20px; overflow: hidden;
}
.lcu-rc-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.lcu-rc-head h5 { margin: 0; font-size: 13.5px; font-weight: 700; color: var(--lcu-text); }
.lcu-rc-head .lcu-rc-avg { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--lcu-muted); font-weight: 600; }
.lcu-rc-head .lcu-rc-avg .lcu-stars-mini { color: var(--lcu-amber); letter-spacing: 1px; font-size: 12px; }

.lcu-rc-viewport { position: relative; min-height: 132px; }
.lcu-rc-slide { display: none; }
.lcu-rc-slide.active { display: block; animation: lcu-rc-fade .35s ease; }
@keyframes lcu-rc-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.lcu-rc-stars-row { color: var(--lcu-amber); font-size: 13px; letter-spacing: 2px; margin-bottom: 8px; }
.lcu-rc-quote { font-size: 13.5px; line-height: 1.6; color: var(--lcu-text); margin: 0 0 12px; }
.lcu-rc-author { display: flex; align-items: center; gap: 8px; }
.lcu-rc-avatar { width: 26px; height: 26px; border-radius: 50%; flex: none; object-fit: cover; }
.lcu-rc-author span { font-size: 12.5px; font-weight: 600; color: var(--lcu-text); }

.lcu-rc-dots { display: flex; justify-content: center; gap: 6px; margin: 14px 0 12px; }
.lcu-rc-dots button { width: 6px; height: 6px; border-radius: 50%; border: none; padding: 0; background: var(--lcu-border); cursor: pointer; }
.lcu-rc-dots button.active { background: var(--lcu-navy); width: 16px; border-radius: 4px; }

.lcu-rc-footer {
    display: block; text-align: center; font-size: 12.5px; font-weight: 700; color: var(--lcu-blue);
    text-decoration: none; padding-top: 12px; border-top: 1px solid var(--lcu-border); cursor: pointer;
}