/* MCB Frontend CSS — Course Catalog, Lesson Player, Dashboard, Mini-Course Sales Page */
:root {
  --mcb-primary: #4f46e5;
  --mcb-primary-hover: #4338ca;
  --mcb-success: #10b981;
  --mcb-danger: #ef4444;
  --mcb-text: #111827;
  --mcb-muted: #6b7280;
  --mcb-border: #e5e7eb;
  --mcb-bg: #f9fafb;
  --mcb-card-bg: #ffffff;
  --mcb-radius: 10px;
  --mcb-shadow: 0 2px 12px rgba(0,0,0,.08);
}

/* ── RESET ── */
.mcb-wrap *, .mcb-wrap *::before, .mcb-wrap *::after { box-sizing:border-box; }
.mcb-wrap { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: var(--mcb-text); }
.mcb-wrap img { max-width:100%; display:block; }
.mcb-wrap a { color: var(--mcb-primary); text-decoration:none; }
.mcb-wrap a:hover { text-decoration:underline; }

/* ── BUTTONS ── */
.mcb-btn-primary {
  display:inline-block; background:var(--mcb-primary); color:#fff; font-weight:600;
  padding:12px 28px; border-radius:8px; border:none; cursor:pointer;
  font-size:1rem; transition:.2s; text-decoration:none !important;
}
.mcb-btn-primary:hover { background:var(--mcb-primary-hover); color:#fff; }
.mcb-btn-secondary {
  display:inline-block; background:transparent; color:var(--mcb-primary);
  border:2px solid var(--mcb-primary); padding:10px 24px; border-radius:8px;
  font-weight:600; cursor:pointer; font-size:.95rem; transition:.2s;
}
.mcb-btn-secondary:hover { background:var(--mcb-primary); color:#fff; }
.mcb-btn-primary:disabled, .mcb-btn-secondary:disabled { opacity:.6; cursor:not-allowed; }

/* ── TOAST NOTIFICATIONS ── */
.mcb-toast {
  position:fixed; bottom:24px; right:24px; z-index:99999;
  background:#1e293b; color:#fff; padding:14px 22px; border-radius:8px;
  font-size:.9rem; font-weight:500; max-width:340px;
  transform:translateY(20px); opacity:0; transition:.3s;
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}
.mcb-toast.show { transform:translateY(0); opacity:1; }
.mcb-toast-error { background:#dc2626; }
.mcb-toast-success { background:#059669; }

/* ══════════════════════════════════════════════════════════════════════════
   COURSE CATALOG
══════════════════════════════════════════════════════════════════════════ */
#mcb-catalog { }

.mcb-catalog-toolbar {
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
  margin-bottom:24px;
}
#mcb-search {
  flex:1; min-width:200px; padding:10px 14px; border:1px solid var(--mcb-border);
  border-radius:8px; font-size:.95rem;
}
#mcb-sort {
  padding:10px 14px; border:1px solid var(--mcb-border); border-radius:8px;
  background:#fff; font-size:.95rem;
}

#mcb-course-grid {
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap:24px;
}

.mcb-course-card {
  display:block; background:var(--mcb-card-bg); border:1px solid var(--mcb-border);
  border-radius:var(--mcb-radius); overflow:hidden; color:var(--mcb-text);
  transition:.2s; box-shadow:var(--mcb-shadow); text-decoration:none !important;
}
.mcb-course-card:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.12); }
.mcb-course-card img { width:100%; height:180px; object-fit:cover; background:#e2e8f0; }

.mcb-card-body { padding:18px; }
.mcb-card-body h3 { margin:0 0 6px; font-size:1rem; font-weight:700; line-height:1.4; }
.mcb-card-meta { color:var(--mcb-muted); font-size:.83rem; margin:0 0 8px; }
.mcb-card-price { font-weight:700; font-size:1.05rem; color:var(--mcb-primary); margin-bottom:6px; }
.mcb-sale { color:#ef4444; }
.mcb-card-rating { color:#f59e0b; font-size:.85rem; }

.mcb-empty { color:var(--mcb-muted); text-align:center; padding:40px; grid-column:1/-1; }

/* Pagination */
#mcb-pagination { display:flex; gap:6px; justify-content:center; margin-top:32px; flex-wrap:wrap; }
.mcb-page-btn {
  padding:8px 14px; border:1px solid var(--mcb-border); background:#fff;
  border-radius:6px; cursor:pointer; font-size:.9rem; transition:.15s;
}
.mcb-page-btn:hover { border-color:var(--mcb-primary); color:var(--mcb-primary); }
.mcb-page-btn.active { background:var(--mcb-primary); color:#fff; border-color:var(--mcb-primary); }

/* ══════════════════════════════════════════════════════════════════════════
   SINGLE COURSE PAGE
══════════════════════════════════════════════════════════════════════════ */
.mcb-course-header {
  display:flex; gap:32px; flex-wrap:wrap; padding:40px 0; border-bottom:1px solid var(--mcb-border);
}
.mcb-course-hero-text { flex:2; min-width:280px; }
.mcb-course-hero-text h1 { margin:0 0 12px; font-size:2rem; }
.mcb-course-hero-text .mcb-course-meta { display:flex; gap:16px; flex-wrap:wrap; color:var(--mcb-muted); font-size:.9rem; margin-bottom:20px; }
.mcb-course-sidebar { flex:1; min-width:280px; }

.mcb-course-card-box {
  border:1px solid var(--mcb-border); border-radius:var(--mcb-radius);
  overflow:hidden; background:var(--mcb-card-bg); box-shadow:var(--mcb-shadow);
}
.mcb-course-card-box img { width:100%; height:220px; object-fit:cover; background:#e2e8f0; }
.mcb-course-card-box-body { padding:20px; }
.mcb-course-price { font-size:2rem; font-weight:800; color:var(--mcb-primary); margin-bottom:4px; }
.mcb-course-price s { font-size:1.1rem; color:var(--mcb-muted); font-weight:400; }
.mcb-enroll-btn, .mcb-pay-btn { width:100%; margin-top:12px; font-size:1.05rem; padding:14px; }

/* What you'll learn */
.mcb-learn-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:10px; list-style:none; padding:0; margin:0;
}
.mcb-learn-grid li::before { content:'✅ '; }

/* ── CURRICULUM ── */
.mcb-curriculum-section { margin:40px 0; }
.mcb-topic { border:1px solid var(--mcb-border); border-radius:8px; overflow:hidden; margin-bottom:8px; }
.mcb-topic-header {
  display:flex; align-items:center; gap:10px; padding:14px 18px;
  background:var(--mcb-bg); cursor:pointer; font-weight:600;
}
.mcb-topic-header:hover { background:#f0f9ff; }
.mcb-topic-count { color:var(--mcb-muted); font-size:.85rem; margin-left:auto; }
.mcb-toggle { font-size:.8rem; transition:.2s; }
.mcb-toggle.open { transform:rotate(180deg); }

.mcb-topic-lessons { display:none; }
.mcb-lesson-row {
  display:flex; align-items:center; gap:10px; padding:12px 18px;
  border-top:1px solid var(--mcb-border); font-size:.92rem;
}
.mcb-lesson-row:hover { background:#f5f3ff; }
.mcb-lesson-icon { width:20px; text-align:center; flex-shrink:0; }
.mcb-lesson-title { flex:1; }
.mcb-lesson-dur { color:var(--mcb-muted); font-size:.82rem; }
.mcb-lesson-row.locked .mcb-lesson-title { color:var(--mcb-muted); }
.mcb-badge { background:#e0e7ff; color:#4f46e5; font-size:.75rem; padding:2px 8px; border-radius:99px; font-weight:600; }

/* ── REVIEWS ── */
.mcb-reviews-section { margin:40px 0; }
.mcb-review { border:1px solid var(--mcb-border); border-radius:8px; padding:16px; margin-bottom:12px; }
.mcb-stars { color:#f59e0b; font-size:1.1rem; }
.mcb-star-select span { cursor:pointer; font-size:1.4rem; color:#d1d5db; transition:.1s; }
.mcb-star-select span.active { color:#f59e0b; }

/* ── STRIPE FORM ── */
.mcb-stripe-form {
  border:1px solid var(--mcb-border); border-radius:var(--mcb-radius);
  padding:20px; margin-top:16px; background:#f8fafc; display:none;
}
.mcb-stripe-form label { display:block; font-size:.85rem; font-weight:600; margin-bottom:6px; color:#374151; }
.mcb-stripe-form input[type=email], .mcb-coupon-code {
  width:100%; padding:10px 14px; border:1px solid var(--mcb-border); border-radius:6px;
  font-size:.95rem; margin-bottom:12px;
}
#mcb-card-element-<?php if(false){} ?> {
  border:1px solid var(--mcb-border); border-radius:6px; padding:12px; background:#fff;
}
.mcb-card-errors { color:#ef4444; font-size:.85rem; margin-top:6px; min-height:20px; }
.mcb-coupon-row { display:flex; gap:8px; margin-bottom:12px; }
.mcb-coupon-code { margin-bottom:0; flex:1; }
.mcb-coupon-msg { font-size:.85rem; margin-bottom:8px; }
.mcb-coupon-msg.success { color:#059669; }
.mcb-coupon-msg.error { color:#dc2626; }
.mcb-current-price { font-weight:700; }

/* ══════════════════════════════════════════════════════════════════════════
   MINI COURSE SALES PAGE (Russell Brunson / one-page funnel style)
══════════════════════════════════════════════════════════════════════════ */
.mcb-mini-hero {
  padding:70px 24px; text-align:center;
  background:var(--mcb-sales-bg, linear-gradient(135deg, #1e1b4b 0%, #312e81 100%));
  color:#fff;
}
.mcb-mini-hero h1 { font-size:2.6rem; font-weight:800; line-height:1.25; margin-bottom:12px; max-width:800px; margin-inline:auto; }
.mcb-mini-hero .mcb-mini-sub { font-size:1.2rem; opacity:.85; margin-bottom:32px; max-width:600px; margin-inline:auto; }
.mcb-mini-hero .mcb-mini-price { font-size:2.4rem; font-weight:900; margin-bottom:4px; }
.mcb-mini-hero .mcb-mini-price s { font-size:1.1rem; opacity:.7; font-weight:400; }
.mcb-mini-cta-btn {
  display:inline-block; margin-top:12px; padding:18px 44px;
  background:#f59e0b; color:#1e1b4b; font-size:1.2rem; font-weight:800;
  border-radius:50px; border:none; cursor:pointer; animation:mcb-pulse 2s infinite;
  text-decoration:none !important; transition:.2s;
}
.mcb-mini-cta-btn:hover { background:#fbbf24; color:#1e1b4b; }
@keyframes mcb-pulse { 0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(245,158,11,.4);} 50%{transform:scale(1.03);box-shadow:0 0 0 12px rgba(245,158,11,0);} }

.mcb-mini-proof { display:flex; gap:32px; justify-content:center; flex-wrap:wrap; margin-top:28px; opacity:.8; font-size:.9rem; }
.mcb-mini-proof span::before { margin-right:6px; }

.mcb-mini-body { max-width:760px; margin:0 auto; padding:50px 20px; }
.mcb-mini-body h2 { font-size:1.7rem; font-weight:700; margin-bottom:16px; }
.mcb-mini-bullets { list-style:none; padding:0; margin:0 0 32px; }
.mcb-mini-bullets li { padding:10px 0; border-bottom:1px solid var(--mcb-border); display:flex; gap:10px; align-items:flex-start; }
.mcb-mini-bullets li::before { content:'✅'; flex-shrink:0; }

.mcb-mini-checkout-box {
  border:2px solid var(--mcb-primary); border-radius:16px;
  padding:32px; background:#fff; box-shadow:0 12px 40px rgba(79,70,229,.1);
  margin-top:40px;
}
.mcb-mini-checkout-box h2 { text-align:center; margin-bottom:24px; }

/* ══════════════════════════════════════════════════════════════════════════
   LESSON PLAYER
══════════════════════════════════════════════════════════════════════════ */
.mcb-lesson-player { max-width:1100px; margin:0 auto; padding:20px; display:flex; gap:24px; flex-wrap:wrap; }

.mcb-video-main { flex:3; min-width:280px; }
.mcb-video-wrap { position:relative; padding-top:56.25%; background:#000; border-radius:10px; overflow:hidden; margin-bottom:20px; }
.mcb-video-wrap iframe, .mcb-video-wrap video { position:absolute; inset:0; width:100%; height:100%; border:none; }

.mcb-lesson-nav { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:16px; }
.mcb-lesson-sidebar { flex:1; min-width:240px; }
.mcb-lesson-sidebar-inner { position:sticky; top:80px; }

.mcb-mark-complete {
  background:var(--mcb-success); color:#fff; border:none; padding:12px 24px;
  border-radius:8px; cursor:pointer; font-weight:600; font-size:1rem; width:100%;
  margin-bottom:12px; transition:.2s;
}
.mcb-mark-complete.done { background:#e2e8f0; color:#64748b; cursor:default; }
.mcb-mark-complete:hover:not(.done) { background:#059669; }

/* Lesson sidebar list */
.mcb-lesson-list-sidebar { list-style:none; padding:0; margin:0; }
.mcb-lesson-list-sidebar li { }
.mcb-lesson-list-sidebar a {
  display:flex; align-items:center; gap:8px; padding:10px 14px;
  border-radius:6px; color:var(--mcb-text); font-size:.9rem;
  transition:.15s; text-decoration:none !important;
}
.mcb-lesson-list-sidebar a:hover { background:var(--mcb-bg); }
.mcb-lesson-list-sidebar a.active { background:#ede9fe; color:var(--mcb-primary); font-weight:600; }
.mcb-lesson-list-sidebar a.completed::after { content:'✅'; margin-left:auto; }

/* Q&A */
.mcb-qa-section { margin-top:32px; border-top:1px solid var(--mcb-border); padding-top:24px; }
.mcb-qa-item { padding:16px 0; border-bottom:1px solid var(--mcb-border); }
.mcb-qa-item:last-child { border-bottom:none; }
.mcb-qa-question { font-weight:600; margin-bottom:8px; }
.mcb-qa-replies { padding-left:20px; margin-top:8px; }
.mcb-qa-reply { background:var(--mcb-bg); border-radius:8px; padding:10px 14px; margin-bottom:6px; font-size:.9rem; }
.mcb-qa-form textarea { width:100%; padding:10px; border:1px solid var(--mcb-border); border-radius:8px; font-size:.9rem; }
.mcb-qa-form button { margin-top:8px; }

/* Progress bar */
.mcb-progress-track { height:6px; background:#e2e8f0; border-radius:99px; overflow:hidden; margin-bottom:8px; }
.mcb-progress-fill { height:100%; background:var(--mcb-success); border-radius:99px; transition:.5s; }

/* ══════════════════════════════════════════════════════════════════════════
   STUDENT DASHBOARD
══════════════════════════════════════════════════════════════════════════ */
.mcb-dashboard { max-width:1000px; margin:0 auto; padding:20px; }
.mcb-dashboard h1 { margin-bottom:24px; }

/* Tabs */
.mcb-dash-tabs { display:flex; gap:4px; border-bottom:2px solid var(--mcb-border); margin-bottom:28px; flex-wrap:wrap; }
.mcb-tab {
  background:none; border:none; padding:10px 22px; cursor:pointer;
  color:var(--mcb-muted); font-size:.92rem; border-bottom:2px solid transparent;
  margin-bottom:-2px; transition:.15s; font-weight:500;
}
.mcb-tab:hover { color:var(--mcb-primary); }
.mcb-tab.active { color:var(--mcb-primary); border-bottom-color:var(--mcb-primary); font-weight:700; }
.mcb-tab-content { display:none; }
.mcb-tab-content.active { display:block; }

/* My Courses */
.mcb-dash-course {
  border:1px solid var(--mcb-border); border-radius:var(--mcb-radius);
  padding:20px; margin-bottom:16px; display:flex; align-items:center;
  gap:20px; flex-wrap:wrap; background:var(--mcb-card-bg);
}
.mcb-dash-course-info { flex:1; min-width:200px; }
.mcb-dash-course h3 { margin:0 0 8px; }
.mcb-progress-bar { height:8px; background:#e2e8f0; border-radius:99px; overflow:hidden; margin-bottom:6px; }
.mcb-progress-bar div { height:100%; background:var(--mcb-success); transition:.5s; }
.mcb-dash-course p { margin:0 0 12px; font-size:.85rem; color:var(--mcb-muted); }
.mcb-dash-course .mcb-btn-primary { padding:10px 20px; font-size:.9rem; flex-shrink:0; }

/* Certificates */
.mcb-cert-item {
  border:2px solid #fcd34d; border-radius:var(--mcb-radius);
  padding:20px; margin-bottom:12px; background:#fffbeb;
}
.mcb-cert-item h3 { margin:0 0 6px; }
.mcb-cert-item p { margin:0 0 10px; font-size:.85rem; color:var(--mcb-muted); }

/* Profile form */
#mcb-profile-form table { max-width:500px; }
#mcb-profile-form .submit { margin-top:12px; }

/* ══════════════════════════════════════════════════════════════════════════
   CHECKOUT PAGE
══════════════════════════════════════════════════════════════════════════ */
.mcb-checkout-wrap { max-width:800px; margin:0 auto; padding:40px 20px; }
.mcb-checkout-wrap h1 { margin-bottom:24px; }
.mcb-checkout-cols { display:flex; gap:24px; flex-wrap:wrap; }
.mcb-checkout-main { flex:2; min-width:280px; }
.mcb-checkout-summary { flex:1; min-width:240px; }

.mcb-gateway-tabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:2px solid var(--mcb-border); }
.mcb-gateway-tab { background:none; border:none; padding:10px 18px; cursor:pointer; color:var(--mcb-muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:.15s; font-weight:500; }
.mcb-gateway-tab.active { color:var(--mcb-primary); border-bottom-color:var(--mcb-primary); }
.mcb-gateway-content { display:none; }
.mcb-gateway-content.active { display:block; }

.mcb-order-summary { border:1px solid var(--mcb-border); border-radius:var(--mcb-radius); padding:20px; }
.mcb-order-summary h3 { margin:0 0 14px; }
.mcb-order-line { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--mcb-border); font-size:.92rem; }
.mcb-order-total { font-weight:700; font-size:1.1rem; }

/* ══════════════════════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════════════════════ */
@media(max-width:700px){
  .mcb-mini-hero h1 { font-size:1.7rem; }
  .mcb-mini-hero .mcb-mini-price { font-size:1.8rem; }
  .mcb-lesson-player { flex-direction:column; }
  .mcb-dash-course { flex-direction:column; }
  .mcb-course-header { flex-direction:column; }
  .mcb-checkout-cols { flex-direction:column; }
}