/* ============================================================
   Course content banners + lock state
   ============================================================ */
.uf-crsc-banner{display:flex;align-items:center;gap:12px;border-radius:14px;padding:14px 18px;margin-bottom:22px;font-size:15px;font-weight:600;}
.uf-crsc-banner.ok{background:#e8f7ef;color:#127a44;border:1px solid #bfe9d1;}
.uf-crsc-banner.lock{background:#fff8ec;color:#8a6414;border:1px solid #f3e2bf;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.uf-crsc-banner .tx{display:flex;align-items:center;gap:10px;}
.uf-crsc-banner i{font-size:18px;}
.uf-page .uf-crsc-banner-btn{background:var(--uf-gold,#f2a41d);color:#0f2a4a;font-weight:700;font-size:14px;border:0;border-radius:10px;padding:9px 22px;cursor:pointer;}
.uf-page .uf-crsc-banner-btn:hover{background:#e0961a;}
.uf-crsc-item.locked .uf-crsc-thumb .ov{background:rgba(15,42,74,.72);}

/* watched (green check) */
.uf-crsc-thumb{position:relative;}
.uf-crsc-tick{position:absolute;top:6px;inset-inline-end:6px;width:23px;height:23px;border-radius:50%;
  background:#12a150;display:none;align-items:center;justify-content:center;z-index:4;box-shadow:0 2px 7px rgba(0,0,0,.35);border:2px solid #fff;}
.uf-crsc-tick svg{width:13px;height:13px;fill:#fff;}
.uf-crsc-item.done .uf-crsc-tick{display:flex;}
.uf-crsc-item.done .uf-crsc-thumb::after{content:"";position:absolute;inset:0;border:2px solid #12a150;border-radius:inherit;z-index:3;pointer-events:none;}
.uf-crsc-item.done .uf-crsc-tt h3{color:#12a150;}

/* ============================================================
   Custom video player (.cvp)
   ============================================================ */
.cvp{--cvp-accent:#f2a41d;position:absolute;inset:0;background:#000;overflow:hidden;
  font-family:inherit;user-select:none;-webkit-user-select:none;}
.cvp-media{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;cursor:pointer;}

.cvp-empty{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;
  background:#0f2a4a;color:#fff;font-size:15px;text-align:center;padding:20px;}

/* loading spinner */
.cvp-spin{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;pointer-events:none;}
.cvp-spin span{width:52px;height:52px;border:4px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:cvp-rot .8s linear infinite;}
@keyframes cvp-rot{to{transform:rotate(360deg)}}

/* center big play/pause */
.cvp-big{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;
  width:74px;height:74px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(0,0,0,.45);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:opacity .2s,transform .15s,background .2s;}
.cvp-big:hover{background:var(--cvp-accent);color:#0f2a4a;transform:translate(-50%,-50%) scale(1.06);}
.cvp-big svg{width:40px;height:40px;fill:currentColor;}
.cvp-big .i-pause{display:none;}
.cvp.is-playing .cvp-big{opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.8);}

/* bottom gradient */
.cvp-shade{position:absolute;left:0;right:0;bottom:0;height:120px;z-index:2;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.72),transparent);}

/* controls */
.cvp-ctrls{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:6px 12px 10px;
  transition:opacity .25s,transform .25s;}
.cvp.hide-ui.is-playing .cvp-ctrls{opacity:0;transform:translateY(8px);pointer-events:none;}
.cvp.hide-ui.is-playing{cursor:none;}

/* seek bar */
.cvp-bar{position:relative;height:16px;display:flex;align-items:center;cursor:pointer;margin-bottom:2px;}
.cvp-bar::before{content:"";position:absolute;left:0;right:0;height:4px;border-radius:4px;background:rgba(255,255,255,.28);transition:height .12s;}
.cvp-bar:hover::before{height:6px;}
.cvp-buf{position:absolute;left:0;height:4px;border-radius:4px;background:rgba(255,255,255,.45);width:0;transition:height .12s;}
.cvp-bar:hover .cvp-buf{height:6px;}
.cvp-fill{position:absolute;left:0;height:4px;border-radius:4px;background:var(--cvp-accent);width:0;transition:height .12s;}
.cvp-bar:hover .cvp-fill{height:6px;}
.cvp-knob{position:absolute;width:13px;height:13px;border-radius:50%;background:var(--cvp-accent);left:0;transform:translateX(-50%);
  opacity:0;transition:opacity .12s;box-shadow:0 0 0 4px rgba(242,164,29,.25);}
.cvp-bar:hover .cvp-knob,.cvp.seeking .cvp-knob{opacity:1;}

/* tools row */
.cvp-tools{display:flex;align-items:center;gap:4px;}
.cvp-t{background:none;border:0;color:#fff;cursor:pointer;padding:6px;border-radius:8px;display:inline-flex;
  align-items:center;justify-content:center;line-height:0;transition:background .15s,color .15s;}
.cvp-t:hover{background:rgba(255,255,255,.15);}
.cvp-t svg{width:22px;height:22px;fill:currentColor;}
.cvp-t.cvp-txt{font-size:13px;font-weight:700;min-width:40px;gap:5px;line-height:1;color:#fff;}
.cvp-t.cvp-txt svg{width:17px;height:17px;}
.cvp-t .i-pause,.cvp-t .i-mute,.cvp-t .i-exit{display:none;}
.cvp.is-playing .cvp-t .i-play{display:none;}
.cvp.is-playing .cvp-t .i-pause{display:inline;}
.cvp.is-muted .cvp-t .i-vol{display:none;}
.cvp.is-muted .cvp-t .i-mute{display:inline;}
.cvp.is-fs .i-fs{display:none;}
.cvp.is-fs .i-exit{display:inline;}

.cvp-flex{flex:1;}
.cvp-time{color:#fff;font-size:12.5px;font-variant-numeric:tabular-nums;padding:0 6px;white-space:nowrap;direction:ltr;}

/* volume */
.cvp-vol{display:flex;align-items:center;}
.cvp-vol-range{width:0;opacity:0;transition:width .18s,opacity .18s;height:4px;cursor:pointer;
  -webkit-appearance:none;appearance:none;background:rgba(255,255,255,.35);border-radius:4px;margin:0;}
.cvp-vol:hover .cvp-vol-range,.cvp-vol-range:focus{width:70px;opacity:1;margin:0 4px;}
.cvp-vol-range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;cursor:pointer;}
.cvp-vol-range::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;cursor:pointer;}

/* popup menus (speed, quality) */
.cvp-pop{position:relative;}
.cvp-pop-menu{position:absolute;bottom:calc(100% + 10px);right:0;min-width:110px;background:rgba(20,24,32,.97);
  border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:6px;display:none;flex-direction:column;gap:2px;
  box-shadow:0 10px 30px rgba(0,0,0,.5);z-index:9;}
.cvp-pop.open .cvp-pop-menu{display:flex;}
.cvp-pop-menu button{background:none;border:0;color:#dfe3ea;font-size:13px;font-weight:600;text-align:right;
  padding:8px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;font-family:inherit;}
.cvp-pop-menu button:hover{background:rgba(255,255,255,.1);}
.cvp-pop-menu button.on{color:var(--cvp-accent);}
.cvp-pop-menu button.on::after{content:" ✓";}

/* fullscreen */
.cvp:fullscreen{width:100vw;height:100vh;}
.cvp:-webkit-full-screen{width:100vw;height:100vh;}
.cvp:fullscreen .cvp-media{object-fit:contain;}

/* mobile */
@media (max-width:640px){
  .cvp-big{width:60px;height:60px;}
  .cvp-big svg{width:32px;height:32px;}
  .cvp-hide-sm{display:none;}
  .cvp-t{padding:7px;}
  .cvp-t svg{width:24px;height:24px;}
  .cvp-vol-range{display:none;}
  .cvp-time{font-size:11.5px;padding:0 3px;}
  .cvp-tools{gap:1px;}
}
