/* VISTORA LMS — course catalog + single course page. Uses theme brand tokens. */
.vlms-course, .vlms-catalog {
  --p: var(--primary,#4A3B6B); --a: var(--accent,#C9A961); --fg: var(--fg,#2D2D2D);
  --mut: var(--muted,#5A5A5A); --bd: var(--border,#E5E5E5); --sec: var(--secondary,#F5E6D3);
  --dark: var(--vp-dark,#14101E);
  color: var(--fg);
}
.vlms-course *, .vlms-catalog * { box-sizing: border-box; }

/* Notices */
.vlms-course-note { padding: .75rem 0; font-size: .92rem; }
.vlms-course-note.ok { background:#e9f6ec; color:#1e7e34; }
.vlms-course-note.warn { background:#fff3df; color:#9a6a00; }
.vlms-course-note.err { background:#fdecea; color:#b3261e; }

/* ---- Hero ---- */
.vlms-course-hero { background: var(--dark); color:#fff; padding: 3rem 0; position: relative; overflow: hidden; }
.vlms-course-hero::before { content:""; position:absolute; inset:0; background: radial-gradient(40rem 40rem at 100% 0, rgba(201,169,97,.18), transparent 60%); }
.vlms-course-hero-grid { position: relative; }
.vlms-course-eyebrow { display:inline-block; color: var(--a); font-size:.78rem; font-weight:700; letter-spacing:.25em; text-transform:uppercase; margin-bottom:.75rem; }
.vlms-course-hero h1 { font-family:'Playfair Display',Georgia,serif; font-size: clamp(1.8rem,4vw,3rem); line-height:1.15; margin:0 0 .75rem; }
.lang-ar .vlms-course-hero h1, .is-rtl .vlms-course-hero h1 { font-family:'Cairo',serif; }
.vlms-course-sub { color: rgba(255,255,255,.72); font-size:1.05rem; max-width:44rem; margin:0 0 1rem; }
.vlms-course-byline { color: rgba(255,255,255,.6); font-size:.9rem; margin-bottom:1rem; }
.vlms-course-byline strong { color:#fff; }
.vlms-course-stats { display:flex; flex-wrap:wrap; gap:1.25rem; color: rgba(255,255,255,.8); font-size:.88rem; }

/* ---- Layout ---- */
/* Scoped under .vlms-course so the vertical padding beats .vp-container{padding:0 1rem}. */
.vlms-course .vlms-course-layout { display:grid; grid-template-columns: 1fr 22rem; gap: 2rem; align-items: start; padding: 3.25rem 1rem 4rem; }
@media (max-width: 960px){ .vlms-course .vlms-course-layout { grid-template-columns: 1fr; padding-top: 2.5rem; } }

/* ---- Player ---- */
.vlms-player-wrap { margin-bottom: .5rem; }
.vlms-player { background:#000; border-radius:16px; overflow:hidden; aspect-ratio:16/9; position:relative; box-shadow:0 28px 60px -30px rgba(20,16,30,.7); }
.vlms-player-video { width:100%; height:100%; display:block; background:#000; }
.vlms-player-cover { position:absolute; inset:0; background-size:cover; background-position:center; display:grid; place-items:center; text-align:center; }
.vlms-player-cover::after { content:""; position:absolute; inset:0; background:rgba(20,16,30,.6); }
.vlms-player-lock { position:relative; font-size:2.5rem; color: var(--a); z-index:1; }
.vlms-player-cover p { position:relative; z-index:1; color:#fff; margin:.5rem 0 0; font-size:.95rem; }

/* Player toolbar (now-playing + download) */
.vlms-player-bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:.85rem; padding:.7rem .9rem .7rem 1.1rem; background:#fff; border:1px solid var(--bd); border-radius:12px; box-shadow:0 6px 18px -14px rgba(74,59,107,.4); }
.vlms-player-now { font-weight:600; color:var(--fg); font-size:.92rem; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vlms-player-dl { display:inline-flex; align-items:center; gap:.45rem; flex-shrink:0; background:var(--p); color:#fff; font-size:.85rem; font-weight:600; padding:.55rem 1.1rem; border-radius:999px; text-decoration:none; transition:background .2s, transform .2s, box-shadow .2s; }
.vlms-player-dl:hover { background:color-mix(in srgb, var(--p) 88%, #000); color:#fff; transform:translateY(-1px); box-shadow:0 10px 22px -12px rgba(74,59,107,.6); }

/* ---- Content blocks ---- */
.vlms-course-block { margin-top: 2rem; }
.vlms-course-block h2 { font-family:'Playfair Display',Georgia,serif; font-size:1.4rem; color: var(--fg); margin:0 0 1rem; }
.lang-ar .vlms-course-block h2 { font-family:'Cairo',serif; }
.vlms-course-desc { color: var(--mut); line-height:1.75; }
.vlms-course-empty { color: var(--mut); font-style: italic; padding: 1.5rem 0; }

/* ---- Curriculum ---- */
.vlms-curric-sec { border:1px solid var(--bd); border-radius:12px; margin-bottom:.75rem; overflow:hidden; background:#fff; }
.vlms-curric-head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.95rem 1.1rem; background:color-mix(in srgb,var(--sec) 35%,#fff); border:0; cursor:pointer; font:inherit; font-weight:700; color:var(--fg); }
.vlms-curric-count { color: var(--mut); font-weight:500; font-size:.82rem; }
.vlms-curric-count i { display:inline-block; transition: transform .2s; }
.vlms-curric-sec.open .vlms-curric-count i { transform: rotate(180deg); }
.vlms-curric-list { list-style:none; margin:0; padding:0; display:none; }
.vlms-curric-sec.open .vlms-curric-list { display:block; }
.vlms-lrow { display:flex; align-items:center; gap:.65rem; padding:.7rem 1.1rem; border-top:1px solid color-mix(in srgb,var(--bd) 70%,transparent); }
.vlms-lrow.playable { cursor:pointer; }
.vlms-lrow.playable:hover { background: color-mix(in srgb,var(--sec) 30%,#fff); }
.vlms-lrow.active { background: color-mix(in srgb,var(--a) 14%,#fff); }
.vlms-lrow-ic { color: var(--a); }
.vlms-lrow-title { flex:1; font-size:.92rem; }
.vlms-lrow-tag { font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color: var(--p); background: color-mix(in srgb,var(--p) 12%,#fff); padding:.12rem .45rem; border-radius:5px; }
.vlms-lrow-dur { color: var(--mut); font-size:.8rem; }

/* ---- Buy box ---- */
.vlms-course-side { position: sticky; top: calc(var(--vp-header-h,5rem) + 1rem); }
.vlms-buybox { background:#fff; border:1px solid var(--bd); border-radius:16px; overflow:hidden; box-shadow:0 18px 40px -26px rgba(74,59,107,.45); }
.vlms-buybox-img { aspect-ratio:16/9; background-size:cover; background-position:center; }
.vlms-buybox-body { padding:1.25rem; }
.vlms-buybox-price { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--p); margin-bottom:1rem; }
.vlms-buybox-cta { display:block; width:100%; text-align:center; cursor:pointer; border:0; border-radius:999px; background:var(--a); color: var(--accent-fg,#2D2D2D); font-weight:700; padding:.9rem; font-size:1rem; transition: box-shadow .25s, transform .2s; }
.vlms-buybox-cta:hover { transform: translateY(-1px); box-shadow:0 0 30px -8px rgba(201,169,97,.7); }
.vlms-buybox-cta.ghost { background:transparent; border:1px solid var(--bd); color:var(--p); font-weight:600; }
.vlms-buybox-incl { list-style:none; margin:1.25rem 0 0; padding:1.1rem 0 0; border-top:1px solid var(--bd); color: var(--mut); font-size:.88rem; }
.vlms-buybox-incl li { padding:.25rem 0; }
.vlms-buybox-incl li:first-child { font-weight:700; color:var(--fg); }
.vlms-incl-note { margin:.6rem 0 0; font-size:.82rem; color:var(--mut); text-align:center; }
.vlms-incl-note a { color:var(--p); font-weight:600; }

/* ---- Catalog ---- */
.vlms-catalog-hero { background: linear-gradient(135deg,var(--dark),#251744); color:#fff; padding: 3.5rem 0; text-align:center; }
.vlms-catalog-hero h1 { font-family:'Playfair Display',serif; font-size: clamp(2rem,4vw,3rem); margin:0 0 .5rem; }
.lang-ar .vlms-catalog-hero h1, .is-rtl .vlms-catalog-hero h1 { font-family:'Cairo',serif; }
.vlms-catalog-hero p { color: rgba(255,255,255,.72); max-width:40rem; margin:0 auto; }
.vlms-catalog-filters { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin: 2rem 0; }
.vlms-catalog-filters a { padding:.5rem 1.1rem; border-radius:999px; border:1px solid var(--bd); color: var(--mut); font-size:.85rem; font-weight:600; text-decoration:none; transition: all .2s; }
.vlms-catalog-filters a:hover, .vlms-catalog-filters a.on { background:var(--p); color:#fff; border-color:var(--p); }
.vlms-catalog-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:1.5rem; padding-bottom:3rem; }
@media (max-width:1000px){ .vlms-catalog-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width:560px){ .vlms-catalog-grid { grid-template-columns: 1fr; } }
.vlms-catalog-nav { display:flex; gap:.4rem; justify-content:center; padding-bottom:3rem; }
.vlms-catalog-nav .page-numbers { padding:.4rem .8rem; border:1px solid var(--bd); border-radius:8px; text-decoration:none; color:var(--p); }
.vlms-catalog-nav .current { background:var(--p); color:#fff; border-color:var(--p); }

/* ---- Course card (shared) ---- */
.vlms-cc { display:flex; flex-direction:column; background:#fff; border:1px solid var(--bd); border-radius:16px; overflow:hidden; text-decoration:none; color:inherit; transition: transform .35s, box-shadow .35s; }
.vlms-cc:hover { transform: translateY(-6px); box-shadow:0 26px 50px -28px rgba(74,59,107,.5); }
.vlms-cc-media { position:relative; aspect-ratio:16/9; background:var(--sec); display:grid; place-items:center; overflow:hidden; }
.vlms-cc-media img { width:100%; height:100%; object-fit:cover; transition: transform .6s; }
.vlms-cc:hover .vlms-cc-media img { transform: scale(1.05); }
.vlms-cc-free { position:absolute; top:.6rem; inset-inline-start:.6rem; background:var(--a); color:var(--accent-fg,#2D2D2D); font-size:.68rem; font-weight:700; text-transform:uppercase; padding:.2rem .55rem; border-radius:6px; }
.vlms-cc-body { padding:1rem 1.1rem 1.2rem; display:flex; flex-direction:column; flex:1; }
.vlms-cc-cat { font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--a); margin-bottom:.4rem; }
.vlms-cc-body h3 { margin:0 0 .5rem; font-size:1rem; line-height:1.35; color:var(--fg); }
.vlms-cc-meta { color:var(--mut); font-size:.8rem; margin-bottom:.9rem; }
.vlms-cc-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; }
.vlms-cc-price { font-weight:700; color:var(--p); }
.vlms-cc-view { display:inline-flex; gap:.3rem; background:var(--p); color:#fff; font-size:.82rem; font-weight:600; padding:.45rem .9rem; border-radius:999px; }

/* Digital-product deliverable (ppt / pdf / ebook / canva — non-course types) */
.vlms-deliver { display:flex; gap:1.25rem; align-items:center; background:#fff; border:1px solid var(--bd); border-radius:1rem; padding:1.25rem; margin-bottom:1.5rem; }
.vlms-deliver-art { flex:0 0 7rem; height:7rem; border-radius:.85rem; background:var(--sec) center/cover no-repeat; display:grid; place-items:center; }
.vlms-deliver-icon { font-size:2.4rem; }
.vlms-deliver-body { flex:1; min-width:0; }
.vlms-deliver-kind { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--p); background:color-mix(in srgb,var(--sec) 60%,#fff); padding:.25rem .6rem; border-radius:999px; margin-bottom:.6rem; }
.vlms-deliver-btn { display:inline-flex; align-items:center; gap:.5rem; background:var(--p); color:#fff; font-weight:700; font-size:.9rem; padding:.7rem 1.2rem; border-radius:.7rem; text-decoration:none; }
.vlms-deliver-btn:hover { filter:brightness(1.1); }
.vlms-deliver-hint { color:var(--mut); font-size:.82rem; margin:.6rem 0 0; }
.vlms-deliver-lock { color:var(--mut); font-weight:600; }
@media (max-width:560px){ .vlms-deliver { flex-direction:column; text-align:center; } }

/* Favorite (❤) button */
.vlms-fav { display:flex; align-items:center; justify-content:center; gap:.5rem; width:100%; margin-top:.75rem; cursor:pointer; background:#fff; border:1px solid var(--bd); color:var(--mut); border-radius:999px; padding:.7rem 1rem; font:inherit; font-size:.92rem; font-weight:600; transition:all .18s; }
.vlms-fav:hover { border-color:#e0668a; color:#d6447a; }
.vlms-fav svg { fill:none; stroke:currentColor; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; transition:all .18s; }
.vlms-fav.on { border-color:#e0668a; color:#d6447a; background:color-mix(in srgb,#e0668a 8%,#fff); }
.vlms-fav.on svg { fill:#e0668a; stroke:#e0668a; }
.vlms-fav[disabled] { opacity:.6; cursor:default; }

/* Compact favorite heart on the card image (top corner) */
.vlms-cc-media { position: relative; }
.vlms-cc-fav { position:absolute; top:.55rem; inset-inline-end:.55rem; z-index:3; width:2.1rem; height:2.1rem; display:grid; place-items:center; border-radius:999px; background:rgba(255,255,255,.92); color:#7a7a86; cursor:pointer; box-shadow:0 4px 12px -4px rgba(0,0,0,.3); transition:transform .15s, color .15s, background .15s; }
.vlms-cc-fav:hover { color:#d6447a; transform:scale(1.1); background:#fff; }
.vlms-cc-fav svg { fill:none; stroke:currentColor; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.vlms-cc-fav.on { color:#d6447a; }
.vlms-cc-fav.on svg { fill:#e0668a; stroke:#e0668a; }
.vlms-cc-fav.vlms-busy { opacity:.6; }

/* Event single + tickets */
.vlms-event-cover { aspect-ratio:16/7; background:var(--sec) center/cover no-repeat; border-radius:14px; margin-bottom:1.5rem; }
.vlms-tickets { display:flex; flex-direction:column; gap:.85rem; }
.vlms-ticket { display:flex; justify-content:space-between; align-items:center; gap:1rem; background:#fff; border:1px solid var(--bd); border-radius:14px; padding:1rem 1.25rem; }
.vlms-ticket-info h3 { margin:0 0 .25rem; font-size:1.02rem; }
.vlms-ticket-info h3 a { color:var(--p); text-decoration:none; }
.vlms-ticket-info p { margin:0; color:var(--mut); font-size:.85rem; }
.vlms-ticket-code { text-align:center; border-inline-start:2px dashed var(--bd); padding-inline-start:1.25rem; }
.vlms-ticket-code span { display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--mut); }
.vlms-ticket-code strong { font-family:monospace; font-size:1.1rem; color:var(--fg); letter-spacing:.05em; }

/* ---- Stars ---- */
.vp-stars { display:inline-flex; align-items:center; gap:1px; vertical-align:middle; }
.vp-star { width:15px; height:15px; }
.vp-stars.sm .vp-star { width:13px; height:13px; }
.vp-star.full { fill:var(--a,#C9A961); stroke:none; }
.vp-star.half { fill:var(--a,#C9A961); opacity:.5; stroke:none; }
.vp-star.empty { fill:none; stroke:var(--a,#C9A961); stroke-width:1.3; }
.vlms-cc-rate { display:inline-flex; align-items:center; gap:.3rem; }

/* ---- Reviews ---- */
.vlms-rev-summary { display:flex; align-items:center; gap:1rem; margin-bottom:1.25rem; }
.vlms-rev-avg { display:flex; align-items:center; gap:.6rem; }
.vlms-rev-avg strong { font-family:'Playfair Display',serif; font-size:2rem; color:var(--p); line-height:1; }
.vlms-rev-avg > span { color:var(--mut); font-size:.85rem; }
.vlms-rev-form { background:#fff; border:1px solid var(--bd); border-radius:14px; padding:1.25rem; margin-bottom:1.5rem; }
.vlms-rev-pick { display:flex; align-items:center; gap:.2rem; margin-bottom:.85rem; font-weight:600; color:var(--fg); }
.vlms-rev-pick label { cursor:pointer; line-height:0; margin-inline-start:.15rem; }
.vlms-rev-pick input { position:absolute; opacity:0; width:0; height:0; }
.vlms-rev-pick svg { fill:none; stroke:var(--a,#C9A961); stroke-width:1.3; transition:fill .12s; }
.vlms-rev-pick label.on svg { fill:var(--a,#C9A961); stroke:none; }
.vlms-rev-form textarea { width:100%; border:1px solid var(--bd); border-radius:10px; padding:.7rem .85rem; font:inherit; margin-bottom:.85rem; }
.vlms-rev-list { list-style:none; margin:1.25rem 0 0; padding:0; display:flex; flex-direction:column; gap:1rem; }
.vlms-rev-item { border-bottom:1px solid var(--bd); padding-bottom:1rem; }
.vlms-rev-head { display:flex; align-items:center; gap:.6rem; }
.vlms-rev-author { font-weight:700; color:var(--fg); }
.vlms-rev-date { color:var(--mut); font-size:.8rem; }
.vlms-rev-item p { color:var(--mut); margin:.35rem 0 0; line-height:1.6; }
.vlms-rev-note { color:var(--mut); font-style:italic; }

/* ---- Public profile ---- */
.vp-profile-hero { background:linear-gradient(135deg,var(--dark,#14101E),#251744); color:#fff; padding:3rem 0; }
.vp-profile-hero-in { display:flex; gap:2rem; align-items:center; flex-wrap:wrap; }
.vp-profile-avatar img { width:120px; height:120px; border-radius:50%; object-fit:cover; border:3px solid rgba(255,255,255,.2); display:block; }
.vp-profile-roles { display:flex; gap:.5rem; margin-bottom:.5rem; }
.vp-profile-role { font-size:.7rem; font-weight:700; text-transform:uppercase; padding:.22rem .6rem; border-radius:999px; }
.vp-profile-role.inst { background:var(--a,#C9A961); color:#2D2D2D; }
.vp-profile-role.cons { background:#1f7a8c; color:#fff; }
.vp-profile-id h1 { font-family:'Playfair Display',serif; margin:0 0 .25rem; font-size:clamp(1.6rem,3vw,2.2rem); color:#fff; }
.lang-ar .vp-profile-id h1 { font-family:'Cairo',serif; }
.vp-profile-title { color:rgba(255,255,255,.75); margin:0 0 .6rem; }
.vp-profile-meta { display:flex; gap:1.25rem; align-items:center; color:rgba(255,255,255,.85); font-size:.9rem; margin-bottom:1.1rem; }
.vp-profile-body { padding:2.5rem 1rem 4rem; }
.vp-profile-bio { max-width:48rem; color:var(--mut); line-height:1.8; margin-bottom:2rem; }
.vp-profile-h2 { font-family:'Playfair Display',serif; font-size:1.5rem; margin:0 0 1.25rem; color:var(--fg); }
.lang-ar .vp-profile-h2 { font-family:'Cairo',serif; }
.vp-profile-empty { color:var(--mut); font-style:italic; }

.vlms-event-cal { display:inline-flex; align-items:center; gap:.4rem; margin-top:.85rem; color:var(--p); font-weight:600; font-size:.85rem; text-decoration:none; border:1px solid var(--bd); border-radius:999px; padding:.45rem .9rem; }
.vlms-event-cal:hover { background:color-mix(in srgb,var(--sec) 40%,#fff); }
