/* ============================================================================
   learn-player.css — v168 (Popup cài đặt video gọn, hai cột bằng nhau)
   Trang học bài: /learn/{slug}/lesson/{id}
   Viết mới hoàn toàn — thay bản v126 cũ.
   ============================================================================ */
:root{
  --lp-blue:#0F3B66;
  --lp-blue-hover:#0B2F52;
  --lp-blue-soft:#EAF2F8;
  --lp-blue-line:#C7D9E8;
  --lp-orange:#FF7A00;
  --lp-orange-d:#D95F00;
  --lp-orange-soft:#FFF4E8;
  --lp-orange-line:#FFD1A6;
  --lp-orange-text:#9A4100;
  --lp-player-inset:14px;
  --lp-green:#16a34a;
  --lp-ink:#1a1d23;
  --lp-muted:#6b7280;
  --lp-line:#e9ebef;
  --lp-bg:#f4f5f7;
  --lp-card:#ffffff;
  --lp-sidebar-w:404px;
  --lp-head-h:54px;
}

*{box-sizing:border-box;}
.lp-body{font-family:"Be Vietnam Pro","Segoe UI",system-ui,sans-serif;color:var(--lp-ink);min-height:100vh;}

/* ===== HEADER (thanh xanh trên cùng) ===== */
.lp-header{
  height:var(--lp-head-h);background:var(--lp-blue);color:#fff;
  display:flex;align-items:center;gap:14px;padding:0 18px;
  position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.lp-header-back{width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  border-radius:7px;color:#fff;text-decoration:none;font-size:1.15rem;transition:background .15s;}
.lp-header-back:hover{background:rgba(255,255,255,.16);}
.lp-header-title{flex:1;font-weight:700;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lp-header-content-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.5);
  background:rgba(255,255,255,.08);color:#fff;border-radius:8px;padding:7px 13px;font-size:.86rem;
  font-weight:600;cursor:pointer;transition:background .15s;}
.lp-header-content-btn:hover{background:rgba(255,122,0,.24);border-color:rgba(255,255,255,.72);}

/* ===== LAYOUT 2 CỘT ===== */
.lp-layout{display:flex;align-items:flex-start;background:var(--lp-bg);}
.lp-main{flex:1;min-width:0;background:#fff;}
.lp-sidebar{
  width:var(--lp-sidebar-w);flex:none;background:var(--lp-card);
  height:calc(100dvh - var(--lp-head-h));position:sticky;top:var(--lp-head-h);
  display:flex;flex-direction:column;border-left:1px solid var(--lp-line);
}
.lp-body.lp-sidebar-closed .lp-sidebar{display:none;}

/* ===== VIDEO ===== */
.lp-stage{background:#000;}
.lp-video-wrap{
  position:relative;width:100%;
  margin:0;
  aspect-ratio:16/9;background:#000;overflow:hidden;
}
.lp-video-wrap iframe,.lp-video-wrap video,
.lp-youtube-secure-shell,.lp-youtube-player,.lp-youtube-player iframe{
  position:absolute;inset:0;width:100%!important;height:100%!important;border:0;display:block;
}
.lp-youtube-secure-shell{background:#000;cursor:default;}
.lp-video-no{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:10px;color:#9aa3ad;background:#0b0d10;}

/* v144: nút phát giữa lớn, mờ trong suốt; chỉ riêng nút này có con trỏ bấm */
.lp-center-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:clamp(96px,8vw,132px);height:clamp(96px,8vw,132px);border-radius:50%;
  border:2px solid rgba(255,255,255,.36);background:rgba(15,59,102,.46);color:#fff;
  box-shadow:0 14px 38px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  font-size:clamp(3.2rem,4.4vw,4.8rem);display:flex;align-items:center;justify-content:center;
  cursor:pointer;touch-action:manipulation;opacity:.82;
  transition:background .16s ease,opacity .16s ease,transform .16s ease,box-shadow .16s ease;z-index:6;}
.lp-center-play i{display:block;line-height:1;transform:translateX(4px);pointer-events:none;}
.lp-center-play:hover{background:rgba(255,122,0,.78);opacity:1;
  transform:translate(-50%,-50%) scale(1.07);box-shadow:0 18px 46px rgba(0,0,0,.36),0 0 0 5px rgba(255,255,255,.12);}
.lp-center-play:focus-visible{outline:3px solid #fff;outline-offset:4px;opacity:1;}
.lp-center-play:active{transform:translate(-50%,-50%) scale(.98);}
.lp-youtube-secure-shell.is-playing .lp-center-play{opacity:0;pointer-events:none;}

/* Lớp chặn thao tác trực tiếp lên iframe YouTube để dùng bộ điều khiển riêng của website.
   Không có lớp che hình ảnh/thông tin YouTube trên video bài học. */
.lp-youtube-title-shield{position:absolute;top:0;left:0;right:0;height:62px;z-index:4;pointer-events:none;}
.lp-youtube-mask{position:absolute;z-index:4;background:transparent;pointer-events:none;}
.lp-mask-top{top:0;left:0;right:0;height:54px;}
.lp-mask-bottom-left{bottom:0;left:0;width:130px;height:46px;}
.lp-mask-bottom-right{bottom:0;right:0;width:130px;height:46px;}
.lp-youtube-click-guard{position:absolute;inset:0;z-index:3;cursor:default;}

/* controls */
.lp-youtube-controls{position:absolute;left:0;right:0;bottom:0;z-index:7;display:flex;align-items:center;
  gap:10px;padding:9px var(--lp-player-inset);background:linear-gradient(0deg,rgba(0,0,0,.78),transparent);
  opacity:0;transition:opacity .2s;}
.lp-video-wrap:hover .lp-youtube-controls,.lp-youtube-secure-shell.is-paused .lp-youtube-controls{opacity:1;}
.lp-control-btn{background:transparent;border:0;color:#fff;font-size:1.05rem;cursor:pointer;
  width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;}
.lp-control-btn:hover{background:rgba(255,255,255,.18);}
/* v1086: cụm âm lượng mở rộng ngang khi hover/focus giống YouTube. */
.lp-volume-control{position:relative;display:inline-flex;align-items:center;flex:0 0 32px;width:32px;min-width:32px;
  height:32px;overflow:hidden;transition:width .18s ease,flex-basis .18s ease;}
.lp-volume-control:hover,.lp-volume-control:focus-within,.lp-volume-control.is-open{
  width:124px;flex-basis:124px;}
.lp-volume-control .lp-control-btn{flex:0 0 32px;min-width:32px;position:relative;z-index:2;}
.lp-volume-slider-wrap{box-sizing:border-box;display:flex;align-items:center;flex:0 0 0;width:0;height:32px;padding:0;
  opacity:0;visibility:hidden;pointer-events:none;transition:width .18s ease,flex-basis .18s ease,opacity .13s ease;}
.lp-volume-control:hover .lp-volume-slider-wrap,
.lp-volume-control:focus-within .lp-volume-slider-wrap,
.lp-volume-control.is-open .lp-volume-slider-wrap{
  flex-basis:88px;width:88px;padding:0 7px 0 4px;opacity:1;visibility:visible;pointer-events:auto;}
.lp-volume-range{display:block;width:77px;min-width:77px;height:18px;margin:0;-webkit-appearance:none;appearance:none;
  background:transparent;cursor:pointer;outline:0;touch-action:none;}
.lp-volume-range::-webkit-slider-runnable-track{height:4px;border-radius:999px;
  background:linear-gradient(90deg,#fff 0 var(--lp-volume-percent,100%),rgba(255,255,255,.38) var(--lp-volume-percent,100%) 100%);}
.lp-volume-range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4px;border:0;border-radius:50%;
  background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.55);}
.lp-volume-range::-moz-range-track{height:4px;border:0;border-radius:999px;background:rgba(255,255,255,.38);}
.lp-volume-range::-moz-range-progress{height:4px;border-radius:999px;background:#fff;}
.lp-volume-range::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.55);}
.lp-volume-range:focus-visible{filter:drop-shadow(0 0 3px rgba(255,255,255,.95));}
.lp-time-current,.lp-time-duration{color:#fff;font-size:.8rem;min-width:64px;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;}
.lp-progress-wrap{position:relative;flex:1;min-width:0;height:24px;display:flex;align-items:center;}
.lp-progress-range{width:100%;min-width:0;-webkit-appearance:none;appearance:none;height:5px;border:0;border-radius:999px;
  background:linear-gradient(90deg,var(--lp-orange) 0 var(--lp-progress-percent,0%),rgba(255,255,255,.32) var(--lp-progress-percent,0%) 100%);cursor:pointer;outline:0;}
.lp-progress-range::-webkit-slider-runnable-track{height:5px;border-radius:999px;background:transparent;}
.lp-progress-range::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;margin-top:-4px;border:0;border-radius:50%;background:var(--lp-orange);box-shadow:0 0 0 2px rgba(255,255,255,.92);}
.lp-progress-range::-moz-range-track{height:5px;border:0;border-radius:999px;background:rgba(255,255,255,.32);}
.lp-progress-range::-moz-range-progress{height:5px;border-radius:999px;background:var(--lp-orange);}
.lp-progress-range::-moz-range-thumb{width:13px;height:13px;border:2px solid #fff;border-radius:50%;background:var(--lp-orange);}
.lp-progress-tooltip{position:absolute;left:0;bottom:calc(100% + 8px);z-index:12;transform:translateX(-50%) translateY(4px);
  min-width:70px;padding:6px 8px;border-radius:7px;background:#fff;color:#334155;font-size:.76rem;font-weight:500;line-height:1;
  text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:0 5px 16px rgba(0,0,0,.26);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease,transform .12s ease;}
.lp-progress-tooltip::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:5px solid transparent;border-top-color:#fff;}
.lp-progress-wrap.is-tooltip-visible .lp-progress-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.lp-quality-box{position:relative;}
.lp-quality-menu{position:absolute;right:0;bottom:42px;background:#16181d;border:1px solid #2a2d34;
  border-radius:10px;padding:8px;width:200px;max-height:300px;overflow:auto;box-shadow:0 10px 30px rgba(0,0,0,.5);}
.lp-quality-menu[hidden]{display:none;}
/* 2 cột: chất lượng | tốc độ — không thanh trượt */
.lp-quality-menu.lp-quality-menu-2col{
  width:340px;max-height:none;overflow:visible;padding:6px;
  display:grid;grid-template-columns:1fr 1fr;gap:0;
}
.lp-quality-menu-2col .lp-quality-col{padding:6px 4px;}
.lp-quality-menu-2col .lp-quality-col + .lp-quality-col{border-left:1px solid #2a2d34;}
.lp-quality-title{color:#9aa3ad;font-size:.72rem;text-transform:uppercase;letter-spacing:.4px;padding:4px 8px;}
.lp-quality-menu button{display:flex;justify-content:space-between;align-items:center;width:100%;
  background:transparent;border:0;color:#e6e8ec;font-size:.82rem;padding:7px 8px;border-radius:6px;cursor:pointer;
  white-space:nowrap;}
.lp-quality-menu button:hover{background:rgba(255,255,255,.08);}
.lp-quality-menu button.active{color:var(--lp-orange);font-weight:700;}
.q-tag{font-size:.68rem;color:#9aa3ad;}
.q-tag-hot{color:#f87171;}
.lp-quality-divider{height:1px;background:#2a2d34;margin:6px 0;}

/* watermark bảo mật */
.lp-security-watermark{position:absolute;z-index:7;display:flex;align-items:center;gap:6px;
  max-width:calc(100% - 16px);padding:6px 10px;border-radius:8px;background:var(--lp-wm-background,transparent);
  color:var(--lp-wm-text-color,#fff);font-size:var(--lp-wm-font-size,12px);opacity:0;
  pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  left:16px;top:16px;line-height:1.25;
  -webkit-text-stroke:var(--lp-wm-outline-width,0) var(--lp-wm-outline-color,#000);
  paint-order:stroke fill;
  will-change:left,top,opacity;
  transition:left .34s ease,top .34s ease,opacity 0s linear;}
.lp-security-watermark.has-outline{text-shadow:
  -1px -1px 0 var(--lp-wm-outline-color,#000),0 -1px 0 var(--lp-wm-outline-color,#000),1px -1px 0 var(--lp-wm-outline-color,#000),
  -1px 0 0 var(--lp-wm-outline-color,#000),1px 0 0 var(--lp-wm-outline-color,#000),
  -1px 1px 0 var(--lp-wm-outline-color,#000),0 1px 0 var(--lp-wm-outline-color,#000),1px 1px 0 var(--lp-wm-outline-color,#000);}
.lp-security-watermark.is-background-transparent{background:transparent!important;padding:0!important;border-radius:0!important;box-shadow:none!important;}
.lp-security-watermark.is-bold{font-weight:700;}
.lp-security-watermark.is-italic{font-style:italic;}
.lp-security-watermark.is-fade-enabled{transition:left .34s ease,top .34s ease,opacity var(--lp-wm-fade-duration,1s) ease;}
.lp-security-watermark.show{opacity:var(--lp-wm-opacity,.18);}
.lp-security-watermark span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lp-security-watermark.is-multiline span{white-space:pre-line;overflow:visible;text-overflow:clip;text-align:left;line-height:1.35;}
.lp-security-watermark img{height:1.4em;flex:0 0 auto;}

/* premium lock overlay (giữ — controller quyết định bật/tắt) */
.lp-premium-lock{position:absolute;inset:0;z-index:8;display:flex;align-items:center;justify-content:center;
  background:rgba(8,10,14,.92);text-align:center;padding:20px;}
.lp-premium-lock-title{color:#fff;font-weight:800;font-size:1.3rem;line-height:1.4;margin-bottom:10px;}
.lp-premium-lock-desc{color:#cbd2da;font-size:.92rem;margin-bottom:18px;}
.lp-premium-lock-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.lp-btn-upgrade{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(90deg,var(--lp-orange),#F25F00);
  color:#fff;font-weight:700;padding:11px 22px;border-radius:9px;text-decoration:none;}
.lp-btn-next-free{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);
  color:#fff;padding:10px 18px;border-radius:9px;text-decoration:none;font-size:.88rem;}
.lp-tag-free{background:var(--lp-green);color:#fff;border-radius:4px;padding:1px 6px;font-size:.72rem;font-weight:700;}

/* ===== INFO PANEL dưới video ===== */
.lp-info-panel{background:var(--lp-card);padding:18px var(--lp-player-inset);border-bottom:1px solid var(--lp-line);}
.lp-lesson-title{font-size:1.4rem;font-weight:800;margin:0 0 12px;line-height:1.35;color:var(--lp-blue);max-width:100%;overflow-wrap:anywhere;}
.lp-lesson-meta-line{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:var(--lp-muted);font-size:.9rem;}
.lp-meta-item{display:inline-flex;align-items:center;gap:6px;}
.lp-meta-item i{color:var(--lp-orange);}
.lp-meta-sep{color:#cbd2da;}
.lp-tag-free,.lp-meta-tag .lp-tag-free{display:inline-flex;align-items:center;gap:4px;background:var(--lp-green);
  color:#fff;font-weight:700;border-radius:5px;padding:2px 9px;font-size:.78rem;}
.lp-tag-premium{display:inline-flex;align-items:center;gap:4px;background:linear-gradient(90deg,var(--lp-orange),#F25F00);
  color:#fff;font-weight:700;border-radius:5px;padding:2px 9px;font-size:.78rem;}
.lp-doc-gradient-btn{display:inline-flex;align-items:center;gap:6px;background:var(--lp-blue-soft);color:var(--lp-blue);
  border:1px solid var(--lp-blue-line);border-radius:7px;padding:5px 12px;font-size:.84rem;font-weight:600;cursor:pointer;}
.lp-doc-gradient-btn:hover{background:#DCEAF5;}

/* hàng tải tài liệu bài học */
.lp-doc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-top:14px;padding:12px 14px;background:var(--lp-orange-soft);border:1px solid var(--lp-orange-line);border-radius:10px;}
.lp-doc-row-info{display:inline-flex;align-items:center;gap:9px;font-size:.9rem;font-weight:600;color:var(--lp-orange-text);}
.lp-doc-row-info i{font-size:1.25rem;color:var(--lp-orange);}
.lp-doc-download-btn{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(90deg,var(--lp-orange),#F25F00);
  color:#fff;border:0;border-radius:8px;padding:9px 18px;font-size:.88rem;font-weight:700;cursor:pointer;
  transition:filter .15s;}
.lp-doc-download-btn:hover{filter:brightness(1.06);}

/* nav buttons */
.lp-nav-btns{display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-top:14px;}
.lp-progress-box{display:inline-flex;align-items:center;gap:7px;background:var(--lp-orange-soft);color:var(--lp-orange-text);
  border:1px solid var(--lp-orange-line);border-radius:8px;padding:7px 13px;font-size:.85rem;}
.lp-progress-box i{color:var(--lp-orange);}
.lp-nav-actions{display:inline-flex;align-items:center;gap:12px;flex-wrap:nowrap;}
.lp-nav-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--lp-blue);color:#fff;
  border:1px solid var(--lp-blue);border-radius:8px;padding:8px 18px;min-width:140px;font-size:.86rem;font-weight:700;
  text-decoration:none;cursor:pointer;transition:all .15s;}
.lp-nav-btn:hover:not(:disabled){background:var(--lp-blue-hover);border-color:var(--lp-blue-hover);color:#fff;}
.lp-nav-btn:disabled{opacity:.45;cursor:not-allowed;}
.lp-nav-btn.primary{background:var(--lp-blue);color:#fff;border-color:var(--lp-blue);margin-left:0;}
.lp-nav-btn.primary:hover{background:var(--lp-blue-hover);color:#fff;border-color:var(--lp-blue-hover);}


/* v132: focus rõ ràng, đồng bộ hai màu chủ đạo */
.lp-control-btn:focus-visible,.lp-header-content-btn:focus-visible,.lp-nav-btn:focus-visible,
.lp-doc-download-btn:focus-visible,.lp-sec-more:focus-visible,.lp-sb-tab:focus-visible{
  outline:3px solid rgba(255,122,0,.28);outline-offset:2px;
}

/* ===== SIDEBAR ===== */
/* dòng "Trải nghiệm toàn bộ..." + switch */
.lp-sidebar-overview{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--lp-line);}
.lp-switch{position:relative;width:42px;height:23px;flex:none;cursor:pointer;}
.lp-switch input{opacity:0;width:0;height:0;}
.lp-switch .lp-slider{position:absolute;inset:0;border-radius:999px;background:#cbd2da;transition:.2s;}
.lp-switch .lp-slider::before{content:"";position:absolute;height:17px;width:17px;left:3px;top:3px;
  border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.3);}
.lp-switch input:checked + .lp-slider{background:var(--lp-orange);}
.lp-switch input:checked + .lp-slider::before{transform:translateX(19px);}
.lp-overview-text{font-size:.86rem;font-weight:600;color:var(--lp-ink);line-height:1.35;}

/* search mảnh */
.lp-sidebar-search{position:relative;padding:10px 16px;border-bottom:1px solid var(--lp-line);}
.lp-sidebar-search i{position:absolute;left:28px;top:50%;transform:translateY(-50%);color:#9aa3ad;font-size:.9rem;}
.lp-sidebar-search input{width:100%;height:38px;border:1px solid var(--lp-line);border-radius:8px;
  padding:0 12px 0 36px;font-size:.86rem;background:#f8f9fb;}
.lp-sidebar-search input:focus{outline:none;border-color:var(--lp-orange);background:#fff;
  box-shadow:0 0 0 3px rgba(255,122,0,.14);}

/* vùng cuộn nội dung */
.lp-sidebar-scroll{flex:1;overflow-y:auto;}
.lp-sidebar-scroll::-webkit-scrollbar{width:7px;}
.lp-sidebar-scroll::-webkit-scrollbar-thumb{background:#d1d6dd;border-radius:4px;}
.lp-sidebar-scroll::-webkit-scrollbar-thumb:hover{background:var(--lp-orange);}

.lp-sb-pane{display:none;}
.lp-sb-pane.active{display:block;}

/* section */
.lp-sec{border-bottom:1px solid var(--lp-line);}
.lp-sec-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:14px 16px;cursor:pointer;background:#fff;user-select:none;}
.lp-sec-head:hover{background:#fafbfc;}
.lp-sec-title{font-weight:800;text-transform:uppercase;font-size:.9rem;line-height:1.4;color:var(--lp-ink);}
.lp-sec-meta-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px;font-size:.76rem;color:var(--lp-muted);}
.lp-sec-meta-line i{color:var(--lp-orange);}
.lp-sec-dot{color:#cbd2da;}
.lp-sec-toggle{flex:none;color:#111827;font-size:1.2rem;line-height:1;margin-top:2px;font-weight:900;}
.lp-sec-toggle i{color:#111827!important;font-weight:900!important;}
.lp-sec-toggle i::before{-webkit-text-stroke:.45px currentColor;text-stroke:.45px currentColor;}
.lp-sec .ic-minus{display:inline;}
.lp-sec .ic-plus{display:none;}
.lp-sec.collapsed .ic-minus{display:none;}
.lp-sec.collapsed .ic-plus{display:inline;}
.lp-sec-body{padding:4px 0 8px;}
.lp-sec.collapsed .lp-sec-body{display:none;}

/* lesson card */
.lp-lesson-card{display:flex;gap:11px;padding:8px 14px;text-decoration:none;color:inherit;align-items:flex-start;
  transition:background .12s;}
.lp-lesson-card:hover{background:#f6f8fb;}
.lp-lesson-card.active{background:var(--lp-orange-soft);box-shadow:inset 3px 0 0 var(--lp-orange);}
.lp-lesson-thumb{position:relative;width:124px;flex:none;aspect-ratio:16/9;border-radius:8px;overflow:hidden;
  background:#11161d;}
.lp-lesson-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.lp-lesson-thumb.no-thumb{display:flex;align-items:center;justify-content:center;}
.lp-lesson-thumb.no-thumb::after{content:"\F4F4";font-family:"bootstrap-icons";color:#475569;font-size:1.4rem;}
.lp-lesson-dur{position:absolute;bottom:5px;right:5px;display:inline-flex;align-items:center;gap:3px;
  background:rgba(17,22,29,.85);color:#fff;font-size:.7rem;font-weight:600;padding:1px 6px;border-radius:5px;}
.lp-lesson-dur i{font-size:.66rem;}
.lp-lesson-done-badge{position:absolute;top:5px;left:5px;width:20px;height:20px;border-radius:50%;
  background:var(--lp-green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.78rem;}
.lp-lesson-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.25);}
.lp-lesson-progress span{display:block;height:100%;background:var(--lp-orange);}
.lp-lesson-info{flex:1;min-width:0;}
.lp-lesson-title-text{display:block;font-size:.86rem;font-weight:600;line-height:1.4;color:var(--lp-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.lp-lesson-card.active .lp-lesson-title-text{color:var(--lp-orange-d);}
.lp-lesson-badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;}
.lp-badge{display:inline-flex;align-items:center;gap:3px;font-size:.7rem;font-weight:700;border-radius:5px;padding:2px 7px;}
.lp-badge-free{background:var(--lp-green);color:#fff;}
.lp-badge-premium{background:#fef3c7;color:var(--lp-orange-text);}
.lp-badge-doc{background:var(--lp-blue-soft);color:var(--lp-blue);border:1px solid var(--lp-blue-line);cursor:pointer;}

/* nút Xem toàn bộ */
.lp-sec-more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;
  background:transparent;border:0;color:var(--lp-orange-d);font-size:.82rem;font-weight:700;
  padding:9px;cursor:pointer;}
.lp-sec-more:hover{color:var(--lp-orange);}
.lp-lesson-hidden{display:none!important;}

/* tabs đáy sidebar: Danh mục | Bình luận */
.lp-sidebar-tabs{display:flex;border-top:1px solid var(--lp-line);background:#fff;flex:none;}
.lp-sb-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px;
  background:transparent;border:0;color:var(--lp-muted);font-size:.78rem;font-weight:600;cursor:pointer;
  border-top:2px solid transparent;}
.lp-sb-tab i{font-size:1.05rem;}
.lp-sb-tab.active{color:var(--lp-orange-d);border-top-color:var(--lp-orange);}

/* thảo luận trong pane */
.lp-discuss-wrap{padding:16px;}
.lp-discuss-wrap h6{font-weight:800;margin:0 0 14px;}
.lp-comment{display:flex;gap:10px;margin-bottom:14px;}
.lp-comment-avatar{width:34px;height:34px;border-radius:50%;background:var(--lp-blue);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;flex:none;}
.lp-comment-name{font-weight:700;font-size:.86rem;}
.lp-comment-time{font-size:.74rem;color:var(--lp-muted);margin-left:6px;}
.lp-comment-text{font-size:.86rem;margin-top:3px;color:#374151;}
.lp-discuss-form textarea{width:100%;border:1px solid var(--lp-line);border-radius:8px;padding:10px;font-size:.88rem;}
.lp-discuss-form textarea:focus{outline:none;border-color:var(--lp-orange);}

/* nút mở nội dung khi sidebar đóng (desktop) */
.lp-floating-content-btn{display:none;position:fixed;right:16px;top:74px;z-index:120;
  align-items:center;gap:7px;background:var(--lp-blue);color:#fff;border:0;border-radius:9px;
  padding:9px 14px;font-size:.85rem;font-weight:600;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.18);}
.lp-body.lp-sidebar-closed .lp-floating-content-btn{display:inline-flex;}

/* ===== MOBILE ===== */
@media (max-width:991.98px){
  .lp-layout{display:block;}
  .lp-sidebar{position:fixed;top:var(--lp-head-h);right:0;width:min(92vw,400px);
    height:calc(100dvh - var(--lp-head-h));z-index:200;transform:translateX(0);
    transition:transform .22s ease;box-shadow:-12px 0 32px rgba(15,23,42,.22);}
  .lp-body.lp-sidebar-closed .lp-sidebar{display:flex;transform:translateX(104%);}
  .lp-body.lp-sidebar-open::before{content:"";position:fixed;inset:var(--lp-head-h) 0 0 0;
    background:rgba(15,23,42,.32);z-index:180;}
  .lp-lesson-title{font-size:1.15rem;}
  .lp-info-panel{padding:14px var(--lp-player-inset);}
  .lp-floating-content-btn{display:inline-flex!important;}
  .lp-nav-actions{gap:10px;}
  .lp-nav-btn{min-width:120px;padding:8px 14px;}
  .lp-nav-btn.primary{margin-left:0;}
}
@media (max-width:480px){
  .lp-lesson-thumb{width:104px;}
  .lp-header-content-btn span{display:none;}
  .lp-nav-btns{gap:10px;}
  .lp-nav-actions{gap:8px;}
  .lp-nav-btn{min-width:114px;padding:8px 12px;font-size:.84rem;}
}

/* ============================================================================
   v133 — Desktop chia 2 cột kiểu YouTube:
   - Video là cột chính, rộng khoảng 74–80% tùy màn hình.
   - Danh sách bài học là cột phụ cố định linh hoạt, không chia 5:5.
   - Hai cột cuộn độc lập; video + toàn bộ nội dung bên dưới luôn cùng bề rộng.
   ============================================================================ */
@media (min-width:992px){
  .lp-layout{
    display:grid;
    /* v165: cột 1 = đúng width video (không còn 1fr) → video sát sidebar, không thừa khoảng trống */
    grid-template-columns:minmax(0, var(--lp-video-fit-w, 1fr)) clamp(360px,25vw,460px);
    column-gap:8px;
    height:calc(var(--lp-viewport-h, 100dvh) - var(--lp-head-h));
    /* Căn giữa cả cụm video+sidebar theo lề trái-phải của viewport */
    max-width:calc(var(--lp-video-fit-w, 100vw) + clamp(360px,25vw,460px) + 8px);
    margin-left:auto;
    margin-right:auto;
    padding:0;
    align-items:stretch;
    overflow:hidden;
    background:#fff;
  }
  .lp-body.lp-sidebar-closed .lp-layout{
    grid-template-columns:minmax(0, var(--lp-video-fit-w, 1fr));
    max-width:var(--lp-video-fit-w, 100%);
  }
  /* Cột chính: video rộng tối đa theo phần không gian còn lại. */
  .lp-main{
    width:100%;
    min-width:0;
    height:100%;
    overflow-y:auto;
    padding:0;
    box-sizing:border-box;
    background:#fff;
  }
  /* Cột phụ giống danh sách đề xuất YouTube: hẹp hơn rõ rệt so với video. */
  .lp-sidebar{
    width:100%;
    min-width:0;
    max-width:none;
    height:100%;
    position:static;
    border-left:1px solid var(--lp-line);
    border-right:1px solid var(--lp-line);
  }
  .lp-info-panel{padding:14px var(--lp-player-inset);}
  .lp-lesson-title{font-size:1.25rem;margin-bottom:10px;}
  .lp-doc-row{margin-top:10px;padding:10px 14px;}
  .lp-nav-btns{margin-top:10px;}
}

/* Màn hình desktop nhỏ: vẫn ưu tiên video, sidebar không vượt quá 360px. */
@media (min-width:992px) and (max-width:1279.98px){
  .lp-layout{
    grid-template-columns:minmax(0, var(--lp-video-fit-w, 1fr)) 360px;
    column-gap:6px;
    max-width:calc(var(--lp-video-fit-w, 100vw) + 360px + 6px);
  }
}

/* Màn hình rất rộng: sidebar giữ gọn như YouTube, phần tăng thêm dành cho video. */
@media (min-width:1920px){
  .lp-layout{
    grid-template-columns:minmax(0, var(--lp-video-fit-w, 1fr)) 460px;
    column-gap:10px;
    max-width:calc(var(--lp-video-fit-w, 100vw) + 460px + 10px);
  }
}


/* ============================================================================
   v135 — Video luôn giữ đúng khung YouTube 16:9
   - Không kéo giãn video theo chiều cao màn hình.
   - Khi thiếu chiều cao, tự giảm đồng thời cả chiều rộng và chiều cao theo tỷ lệ 16:9.
   - Khối thông tin bên dưới luôn bằng đúng chiều rộng khung video.
   - Vẫn chừa đủ vùng để thấy tiêu đề và nút Tải tài liệu phía dưới taskbar.
   ============================================================================ */
@media (min-width:992px){
  .lp-video-wrap{
    width:min(100%, var(--lp-video-fit-w, 100%));
    height:auto;
    min-height:0;
    max-height:none;
    aspect-ratio:16/9;
    margin-left:auto;
    margin-right:auto;
    transition:width .16s ease;
  }
  .lp-info-panel{
    width:min(100%, var(--lp-video-fit-w, 100%));
    margin-left:auto;
    margin-right:auto;
  }
  .lp-local-video{
    object-fit:contain;
  }
  .lp-main{
    scroll-padding-bottom:64px;
  }
}

/* Toàn màn hình phải dùng trọn màn hình, không giữ giới hạn tự co. */
.lp-video-wrap:fullscreen,
.lp-video-wrap:-webkit-full-screen{
  width:100vw!important;
  height:100vh!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:0!important;
}



/* ============================================================================
   v138 — Toàn màn hình: tự ẩn chuột + thanh điều khiển sau 2 giây
   - Chỉ áp dụng khi khung video của website đang ở chế độ fullscreen.
   - Rê chuột/chạm/phím bất kỳ sẽ hiện lại ngay, sau đó tự ẩn tiếp.
   - Ghi đè trạng thái :hover để thanh tiến trình thực sự biến mất khi chuột đứng yên.
   ============================================================================ */
.lp-video-wrap.lp-player-fullscreen .lp-youtube-controls{
  transform:translateY(0);
  transition:opacity .18s ease,transform .18s ease;
}
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-controls-visible .lp-youtube-controls{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0)!important;
}
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle,
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle .lp-youtube-secure-shell,
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle .lp-youtube-click-guard,
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle iframe,
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle *{
  cursor:none!important;
}
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle .lp-youtube-controls,
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle:hover .lp-youtube-controls{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(12px)!important;
}

/* ============================================================================
   v136 — Sửa triệt để cuộn Nội dung khóa học + nút cam đỏ loang
   - Sidebar là flex container có min-height:0, vùng danh sách nhận chiều cao còn lại
     và tự cuộn độc lập trên mọi bài học.
   - Chặn cuộn xuyên sang cột video; hỗ trợ wheel, touch, trackpad và bàn phím.
   - Nút Nội dung khóa học dùng gradient cam → đỏ, đồng bộ nhận diện Văn Thế MMO.
   ============================================================================ */
.lp-header-content-btn,
.lp-floating-content-btn{
  background:linear-gradient(135deg,#FF8A00 0%,#FF6A00 46%,#E94118 100%);
  border:1px solid rgba(255,255,255,.72);
  color:#fff;
  box-shadow:0 5px 16px rgba(233,65,24,.24),inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;
}
.lp-header-content-btn:hover,
.lp-header-content-btn.is-open,
.lp-floating-content-btn:hover{
  background:linear-gradient(135deg,#FF970F 0%,#FF6500 46%,#D93615 100%);
  border-color:#fff;
  color:#fff;
  filter:saturate(1.05);
  transform:translateY(-1px);
  box-shadow:0 7px 20px rgba(233,65,24,.32),inset 0 1px 0 rgba(255,255,255,.28);
}
.lp-header-content-btn:active,
.lp-floating-content-btn:active{transform:translateY(0);}
.lp-header-content-btn:focus-visible,
.lp-floating-content-btn:focus-visible{
  outline:3px solid rgba(255,179,102,.55);
  outline-offset:2px;
}

.lp-layout,
.lp-sidebar,
.lp-sidebar-scroll{
  min-height:0;
}
.lp-sidebar{
  overflow:hidden;
  overscroll-behavior:contain;
}
.lp-sidebar-search{
  flex:0 0 auto;
}
.lp-sidebar-scroll{
  flex:1 1 0%;
  height:0;
  max-height:100%;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  scrollbar-gutter:stable;
  scroll-behavior:auto;
  outline:none;
}
.lp-sidebar-scroll:focus-visible{
  box-shadow:inset 0 0 0 2px rgba(255,122,0,.32);
}

@media (min-width:992px){
  .lp-layout{min-height:0;}
  .lp-sidebar{
    height:100%;
    max-height:100%;
    min-height:0;
    overflow:hidden;
  }
  .lp-sidebar-scroll{
    min-height:0;
    height:0;
  }
}

@media (max-width:991.98px){
  .lp-sidebar{
    min-height:0;
    overflow:hidden;
  }
  .lp-sidebar-scroll{
    min-height:0;
    height:0;
  }
}

/* ============================================================================
   v137 — Cuộn sidebar native, nhạy và không lag
   - Không chặn wheel/trackpad bằng JavaScript.
   - Không dùng smooth cho các thay đổi scrollTop liên tục.
   - Tách vùng cuộn thành một lớp composited, giảm repaint khi danh sách dài.
   ============================================================================ */
.lp-sidebar-scroll{
  scroll-behavior:auto!important;
  contain:layout paint style;
  transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-font-smoothing:antialiased;
}
.lp-lesson-card{
  contain:layout paint style;
}

/* ============================================================================
   v149 — Menu Cài đặt video 5:5 gọn, cân đối theo nội dung
   - Hai cột Chất lượng và Tốc độ giữ đúng 50/50.
   - Thu hẹp popup và dàn đều các mức tốc độ để không còn vùng trống lớn bên phải.
   - Giữ nguyên cơ chế chỉ cuộn phần thông tin bên dưới video khi thiếu chiều cao.
   ============================================================================ */
.lp-quality-menu.lp-quality-menu-2col{
  /* v149: hai cột vẫn chia đúng 5:5 nhưng popup ôm sát nội dung hơn. */
  width:min(224px,calc(100vw - 16px));
  grid-template-columns:repeat(2,minmax(0,1fr));
  padding:4px;
  border-radius:9px;
}
.lp-quality-menu-2col .lp-quality-col{
  min-width:0;
  padding:3px 2px;
  display:flex;
  flex-direction:column;
}
.lp-quality-title{
  flex:0 0 auto;
  font-size:.64rem;
  padding:3px 5px 4px;
}
.lp-quality-menu button{
  min-width:0;
  min-height:27px;
  gap:4px;
  padding:4px 5px;
  font-size:.72rem;
  line-height:1.15;
}
/* Cột tốc độ có ít lựa chọn hơn: dàn đều theo chiều cao cột chất lượng,
   tránh khoảng trống lớn ở nửa dưới bên phải. */
.lp-quality-menu-2col .lp-quality-col:last-child button[data-lp-rate]{
  flex:1 1 0;
}
.lp-quality-menu button > span{
  min-width:0;
  margin-left:auto;
  overflow:hidden;
  text-overflow:ellipsis;
}
.q-tag{font-size:.56rem;}

@media (min-width:992px){
  .lp-main{
    display:flex;
    flex-direction:column;
    min-height:0;
    overflow:hidden!important;
  }
  .lp-video-wrap{
    flex:0 0 auto;
  }
  .lp-info-panel{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior-y:contain;
    scrollbar-gutter:stable;
    scroll-behavior:auto;
  }
  .lp-info-panel::-webkit-scrollbar{width:7px;}
  .lp-info-panel::-webkit-scrollbar-track{background:transparent;}
  .lp-info-panel::-webkit-scrollbar-thumb{background:#c8ced6;border-radius:999px;}
  .lp-info-panel::-webkit-scrollbar-thumb:hover{background:var(--lp-orange);}
}



/* v144 — Giữ nút phát cân đối trên tablet/mobile */
@media (max-width: 767px){
  .lp-center-play{width:88px;height:88px;font-size:3rem;border-width:1.5px;}
}


/* ============================================================================
   v145 — Mobile: NỘI DUNG KHÓA HỌC nằm bên dưới bài học
   - Tiêu đề hiển thị IN HOA toàn bộ.
   - Không dùng sidebar phủ màn hình trên mobile; danh sách bài học nối tiếp ngay dưới
     video/thông tin bài học để tận dụng vùng trống và cuộn chung tự nhiên với trang.
   - Nút trên header trở thành nút cuộn nhanh đến khu vực nội dung khóa học.
   ============================================================================ */
.lp-header-content-btn span,
.lp-floating-content-btn span{
  text-transform:uppercase;
}
.lp-mobile-sidebar-title{
  display:none;
}

@media (max-width:991.98px){
  .lp-body{
    min-height:100vh;
    background:var(--lp-bg);
  }
  .lp-layout{
    display:flex!important;
    flex-direction:column;
    width:100%;
    height:auto!important;
    min-height:0;
    overflow:visible!important;
    background:var(--lp-bg);
  }
  .lp-main{
    order:1;
    width:100%;
    height:auto!important;
    min-height:0;
    overflow:visible!important;
    background:#fff;
  }
  .lp-info-panel{
    width:100%;
    height:auto!important;
    min-height:0;
    max-height:none;
    overflow:visible!important;
  }
  .lp-sidebar,
  .lp-body.lp-sidebar-open .lp-sidebar,
  .lp-body.lp-sidebar-closed .lp-sidebar{
    order:2;
    position:static!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    transform:none!important;
    transition:none!important;
    overflow:visible!important;
    border-left:0;
    border-right:0;
    border-top:10px solid var(--lp-bg);
    box-shadow:none!important;
    background:#fff;
    scroll-margin-top:calc(var(--lp-head-h) + 8px);
  }
  .lp-body.lp-sidebar-open::before,
  .lp-body.lp-sidebar-closed::before{
    display:none!important;
    content:none!important;
  }
  .lp-mobile-sidebar-title{
    display:flex;
    align-items:center;
    gap:9px;
    padding:15px 16px 12px;
    color:var(--lp-blue);
    background:#fff;
    border-bottom:1px solid var(--lp-line);
    font-size:1rem;
    line-height:1.25;
    font-weight:800;
    letter-spacing:.02em;
    text-transform:uppercase;
  }
  .lp-mobile-sidebar-title i{
    color:var(--lp-orange);
    font-size:1.05rem;
  }
  .lp-sidebar-search{
    padding-top:12px;
  }
  .lp-sidebar-scroll{
    flex:none!important;
    width:100%;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
    scrollbar-gutter:auto!important;
    contain:none!important;
    transform:none!important;
  }
  .lp-floating-content-btn{
    display:none!important;
  }
  .lp-header-content-btn{
    flex:0 0 auto;
    max-width:min(44vw,190px);
    padding:7px 10px;
    gap:6px;
    font-size:.72rem;
    line-height:1.15;
    white-space:nowrap;
  }
  .lp-header-content-btn span{
    display:inline!important;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .lp-header-title{
    min-width:0;
  }
}

@media (max-width:480px){
  .lp-header{
    gap:7px;
    padding-left:8px;
    padding-right:8px;
  }
  .lp-header-back{
    width:28px;
    height:28px;
    flex:0 0 28px;
  }
  .lp-header-title{
    font-size:.84rem;
  }
  .lp-header-content-btn{
    max-width:46vw;
    padding:7px 8px;
    font-size:.66rem;
  }
  .lp-header-content-btn i{
    font-size:.85rem;
  }
  .lp-mobile-sidebar-title{
    font-size:.94rem;
    padding:14px var(--lp-player-inset) 11px;
  }
}


/* ============================================================================
   v146 — Mobile/tablet: bỏ thanh cuộn dọc cạnh video
   - Vẫn cho phép cuộn trang bằng chuột, trackpad và cảm ứng để xem phần thông tin
     và NỘI DUNG KHÓA HỌC phía dưới.
   - Chỉ ẩn hình thanh scrollbar, không khóa thao tác cuộn và không tạo scrollbar
     riêng trên khung video.
   ============================================================================ */
@media (max-width:991.98px){
  html,
  body,
  .lp-body,
  .lp-layout,
  .lp-main,
  .lp-info-panel,
  .lp-sidebar,
  .lp-sidebar-scroll{
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }
  html::-webkit-scrollbar,
  body::-webkit-scrollbar,
  .lp-body::-webkit-scrollbar,
  .lp-layout::-webkit-scrollbar,
  .lp-main::-webkit-scrollbar,
  .lp-info-panel::-webkit-scrollbar,
  .lp-sidebar::-webkit-scrollbar,
  .lp-sidebar-scroll::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
    background:transparent!important;
  }
  .lp-video-wrap,
  .lp-youtube-secure-shell,
  .lp-local-video{
    overflow:hidden!important;
    overscroll-behavior:none;
  }
}

/* ============================================================================
   v148 — Tự ẩn điều khiển toàn màn hình ổn định + bấm trực tiếp video để play/pause
   - Trạng thái controls-hidden được ưu tiên cao hơn :hover.
   - Nút fullscreen còn focus sau cú click không giữ thanh điều khiển mãi mãi.
   ============================================================================ */
.lp-youtube-secure-shell.controls-hidden .lp-youtube-controls,
.lp-youtube-secure-shell.controls-hidden:hover .lp-youtube-controls{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(12px)!important;
}
.lp-youtube-secure-shell.controls-visible .lp-youtube-controls{
  opacity:1;
  visibility:visible;
}
.lp-video-wrap.lp-player-fullscreen.lp-fullscreen-idle .lp-center-play{
  cursor:none!important;
}

/* ============================================================================
   v150 — Mobile: nút NỘI DUNG KHÓA HỌC chỉ còn icon nhỏ
   - Danh sách bài học đã nằm sẵn bên dưới nên không cần nút chữ dài trên header.
   - Giữ nguyên chức năng: bấm icon sẽ cuộn nhanh tới phần NỘI DUNG KHÓA HỌC.
   - Desktop vẫn giữ nguyên nút đầy đủ chữ như trước.
   ============================================================================ */
@media (max-width:991.98px){
  .lp-header-content-btn{
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    padding:0!important;
    gap:0!important;
    border-radius:10px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .lp-header-content-btn span{
    display:none!important;
  }
  .lp-header-content-btn i{
    margin:0!important;
    font-size:1.02rem!important;
    line-height:1!important;
  }
}
@media (max-width:480px){
  .lp-header-content-btn{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
    border-radius:9px!important;
  }
  .lp-header-content-btn i{
    font-size:.94rem!important;
  }
}


/* v151 — Menu chất lượng chỉ giữ Tự động, 4K, 2K, 1080p, 720p.
   Hai cột hiện có cùng số lựa chọn nên popup 5:5 tự cân bằng, không còn khoảng thừa. */

/* ============================================================================
   v161 — Pseudo-fullscreen fallback (iOS Chrome / WKWebView không support
   Fullscreen API cho div/iframe — phải dùng CSS để giả fullscreen)
   ============================================================================ */
.lp-video-wrap.lp-pseudo-fullscreen{
  position:fixed !important;
  inset:0 !important;
  top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  z-index:99999 !important;
  background:#000 !important;
  aspect-ratio:auto !important;
  border-radius:0 !important;
}
body.lp-pseudo-fs-lock,
html.lp-pseudo-fs-lock{
  overflow:hidden !important;
  height:100vh !important;
  height:100dvh !important;
  touch-action:none !important;
  -webkit-overflow-scrolling:auto !important;
}
html.lp-pseudo-fs-lock{
  position:fixed !important;
  width:100% !important;
  top:0 !important; left:0 !important;
}
/* iframe / video bên trong phải fill khung */
.lp-video-wrap.lp-pseudo-fullscreen iframe,
.lp-video-wrap.lp-pseudo-fullscreen video,
.lp-video-wrap.lp-pseudo-fullscreen .lp-youtube-secure-shell,
.lp-video-wrap.lp-pseudo-fullscreen .lp-youtube-player{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
}
/* Controls phải hiển thị trên pseudo-fullscreen */
.lp-video-wrap.lp-pseudo-fullscreen .lp-youtube-controls{
  opacity:1 !important;
  z-index:100000 !important;
}


/* ============================================================================
   v169 — Popup Cài đặt video ẩn mặc định, mở bằng icon và tự ẩn
   - Xóa khoảng đen dư bên phải.
   - Hai cột Tốc độ / Chất lượng bằng nhau tuyệt đối.
   - Không đổi chức năng chọn tốc độ/chất lượng.
   ============================================================================ */
.lp-quality-menu.lp-quality-menu-2col{
  width:276px!important;
  min-width:276px!important;
  max-width:calc(100vw - 18px)!important;
  overflow:visible!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:0!important;
  padding:5px!important;
  border-radius:10px!important;
  box-sizing:border-box!important;
}
.lp-quality-menu.lp-quality-menu-2col[hidden],
.lp-quality-menu.lp-quality-menu-2col:not(.is-open){
  display:none!important;
}
.lp-quality-menu.lp-quality-menu-2col.is-open{
  display:grid!important;
}
.lp-quality-menu-2col .lp-quality-col{
  width:auto!important;
  min-width:0!important;
  padding:4px 6px!important;
  box-sizing:border-box!important;
}
.lp-quality-menu-2col .lp-quality-col + .lp-quality-col{
  border-left:1px solid #2a2d34!important;
}
.lp-quality-title{
  padding:4px 4px 6px!important;
  font-size:.68rem!important;
  letter-spacing:.35px!important;
}
.lp-quality-menu button{
  min-height:32px!important;
  padding:5px 4px!important;
  font-size:.8rem!important;
  gap:6px!important;
  border-radius:7px!important;
}
.lp-quality-menu-2col .lp-quality-col button[data-lp-rate],
.lp-quality-menu-2col .lp-quality-col button[data-lp-quality]{
  flex:0 0 auto!important;
}
.lp-quality-menu button > span{
  flex:0 0 auto!important;
  margin-left:6px!important;
}
.lp-quality-menu .q-tag{font-size:.6rem!important;}
@media(max-width:420px){
  .lp-quality-menu.lp-quality-menu-2col{
    width:256px!important;
    min-width:256px!important;
  }
  .lp-quality-menu button{font-size:.76rem!important;padding-left:3px!important;padding-right:3px!important;}
}


/* ============================================================================
   v170 — Khóa popup Cài đặt video: mặc định ẩn tuyệt đối
   - Popup không được hiện khi mở video, play/pause, rê chuột hoặc hiện controls.
   - Chỉ hiện khi shell có class is-quality-open và menu có class is-open.
   ============================================================================ */
.lp-youtube-secure-shell:not(.is-quality-open) [data-lp-quality-menu],
.lp-youtube-secure-shell [data-lp-quality-menu][hidden],
.lp-quality-menu.lp-quality-menu-2col[aria-hidden="true"]{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.lp-youtube-secure-shell.is-quality-open [data-lp-quality-menu].is-open:not([hidden]){
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}


/* ============================================================================
   v171 — Gộp thời lượng, trạng thái bài giảng, tiến độ và điều hướng vào 1 hàng
   Thứ tự: thời lượng → bài giảng FREE/PREMIUM → hoàn thành → Bài trước → Bài sau.
   ============================================================================ */
.lp-lesson-action-line{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:14px;
  margin-top:2px;
  color:var(--lp-muted);
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.lp-lesson-action-line::-webkit-scrollbar{display:none;}
.lp-lesson-action-line .lp-meta-item,
.lp-lesson-action-line .lp-progress-box,
.lp-lesson-action-line .lp-nav-actions{
  flex:0 0 auto;
}
.lp-lesson-action-line .lp-meta-duration{font-size:.9rem;}
.lp-lesson-action-line .lp-meta-access{font-size:.9rem;gap:8px;}
.lp-lesson-action-line .lp-meta-sep{flex:0 0 auto;color:#cbd2da;}
.lp-lesson-action-line .lp-progress-box{
  margin:0;
  min-height:44px;
  padding:8px 16px;
  border-radius:11px;
  font-size:.92rem;
  font-weight:800;
}
.lp-lesson-action-line .lp-nav-actions{
  display:inline-flex;
  align-items:center;
  gap:14px;
  flex-wrap:nowrap;
}
.lp-lesson-action-line .lp-nav-btn{
  min-height:44px;
  min-width:150px;
  padding:9px 20px;
  border-radius:11px;
  font-size:.92rem;
  font-weight:800;
}
.lp-lesson-action-line + .lp-nav-btns{display:none!important;}

@media (max-width:991.98px){
  .lp-lesson-action-line{
    gap:10px;
    padding-bottom:2px;
  }
  .lp-lesson-action-line .lp-progress-box{
    min-height:40px;
    padding:7px 12px;
    font-size:.84rem;
  }
  .lp-lesson-action-line .lp-nav-actions{gap:8px;}
  .lp-lesson-action-line .lp-nav-btn{
    min-height:40px;
    min-width:112px;
    padding:8px 12px;
    font-size:.84rem;
  }
  .lp-lesson-action-line .lp-meta-access,
  .lp-lesson-action-line .lp-meta-duration{font-size:.84rem;}
}
@media (max-width:420px){
  .lp-lesson-action-line{gap:8px;}
  .lp-lesson-action-line .lp-meta-sep{display:none;}
  .lp-lesson-action-line .lp-nav-btn{min-width:104px;}
}


/* ============================================================================
   v173 — Mobile: cho cụm Bài trước / Bài sau tự xuống dòng riêng
   Thứ tự vẫn giữ: thời lượng → bài giảng → hoàn thành → Bài trước → Bài sau.
   ============================================================================ */
@media (max-width:991.98px){
  .lp-lesson-action-line{
    flex-wrap:wrap;
    overflow-x:visible;
    row-gap:10px;
  }
  .lp-lesson-action-line .lp-meta-duration,
  .lp-lesson-action-line .lp-meta-sep,
  .lp-lesson-action-line .lp-meta-access,
  .lp-lesson-action-line .lp-progress-box{
    flex:0 0 auto;
  }
  .lp-lesson-action-line .lp-nav-actions{
    flex:0 0 100%;
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .lp-lesson-action-line .lp-nav-btn{
    width:100%;
    min-width:0;
  }
}
@media (max-width:430px){
  .lp-lesson-action-line{
    gap:8px 9px;
  }
  .lp-lesson-action-line .lp-progress-box{
    flex:1 1 auto;
    justify-content:center;
    min-width:0;
  }
}

/* v205: nút Premium rõ icon kim cương và tương phản tốt hơn */
.lp-btn-upgrade{
  background:linear-gradient(90deg,#ff7a00 0%,#f25f00 62%,#e94e00 100%)!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(255,106,0,.22)!important;
}
.lp-premium-gem{
  width:26px;height:26px;border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff;color:#d94d00;flex:0 0 26px;
  box-shadow:0 2px 7px rgba(0,0,0,.14);
}
.lp-premium-gem i{color:#d94d00!important;font-size:14px!important;}
.lp-tag-premium{
  background:linear-gradient(90deg,#ff7a00,#ef5c00)!important;
  color:#fff!important;
}
.lp-tag-premium i{color:#fff!important;}
.lp-badge-premium{
  background:linear-gradient(90deg,#ff8a00,#f25f00)!important;
  color:#fff!important;
  border:0!important;
}
.lp-badge-premium i{color:#fff!important;}

/* ============================================================================
   v207 — Mobile: giữ nút Toàn màn hình luôn nhìn thấy và bấm được
   - Thu gọn khoảng cách/thời gian trong thanh điều khiển để nút cuối không bị đẩy
     ra ngoài hoặc bị lớp khác che.
   - Chừa safe-area đáy cho iPhone khi fullscreen/pseudo-fullscreen.
   ============================================================================ */
@media (max-width: 575.98px){
  .lp-youtube-controls{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:3px!important;
    padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px))!important;
    overflow:visible!important;
    align-items:center!important;
  }
  .lp-youtube-controls .lp-control-btn{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
    padding:0!important;
    border-radius:7px!important;
  }
  .lp-youtube-controls .lp-time-current,
  .lp-youtube-controls .lp-time-duration{
    min-width:48px!important;
    width:48px!important;
    flex:0 0 48px!important;
    font-size:.66rem!important;
    letter-spacing:-.15px!important;
  }
  .lp-youtube-controls .lp-progress-wrap{
    min-width:24px!important;
    width:auto!important;
    flex:1 1 24px!important;
    margin:0 1px!important;
  }
  .lp-youtube-controls .lp-progress-range{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  .lp-youtube-controls .lp-quality-box{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
  }
  /* Mobile không có hover: giữ nguyên độ rộng thanh controls và mở slider nổi
     phía trên sau khi học viên chạm icon loa. */
  .lp-youtube-controls .lp-volume-control,
  .lp-youtube-controls .lp-volume-control:hover,
  .lp-youtube-controls .lp-volume-control:focus-within,
  .lp-youtube-controls .lp-volume-control.is-open{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    overflow:visible!important;
  }
  .lp-youtube-controls .lp-volume-control .lp-control-btn{
    flex:0 0 30px!important;
    min-width:30px!important;
  }
  .lp-youtube-controls .lp-volume-slider-wrap{
    position:absolute;left:50%;bottom:calc(100% + 8px);z-index:35;
    width:112px!important;height:38px;flex-basis:112px!important;padding:0 12px!important;
    border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(15,18,24,.94);
    box-shadow:0 8px 24px rgba(0,0,0,.45);transform:translate(-50%,5px);
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:opacity .14s ease,transform .14s ease!important;
  }
  .lp-youtube-controls .lp-volume-control.is-open .lp-volume-slider-wrap{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate(-50%,0);
  }
  .lp-youtube-controls .lp-volume-range{width:88px;min-width:88px;}
  .lp-youtube-controls [data-lp-fullscreen]{
    position:relative!important;
    z-index:20!important;
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    margin:0!important;
  }
  .lp-video-wrap.lp-pseudo-fullscreen .lp-youtube-controls,
  .lp-video-wrap:fullscreen .lp-youtube-controls,
  .lp-video-wrap:-webkit-full-screen .lp-youtube-controls{
    padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
    z-index:100002!important;
  }
}

@media (max-width: 360px){
  .lp-youtube-controls{
    gap:2px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
  .lp-youtube-controls .lp-time-current,
  .lp-youtube-controls .lp-time-duration{
    min-width:44px!important;
    width:44px!important;
    flex-basis:44px!important;
    font-size:.62rem!important;
  }
  .lp-youtube-controls .lp-control-btn,
  .lp-youtube-controls .lp-quality-box{
    width:28px!important;
    min-width:28px!important;
    flex-basis:28px!important;
  }
  .lp-youtube-controls .lp-volume-control,
  .lp-youtube-controls .lp-volume-control:hover,
  .lp-youtube-controls .lp-volume-control:focus-within,
  .lp-youtube-controls .lp-volume-control.is-open{
    width:28px!important;
    min-width:28px!important;
    flex-basis:28px!important;
  }
  .lp-youtube-controls .lp-volume-control .lp-control-btn{
    min-width:28px!important;
    flex-basis:28px!important;
  }
}

/* ===== v223 course review button + modal ===== */
.lp-review-course-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #fdba74;background:linear-gradient(90deg,#fff7ed,#ffedd5);color:#c2410c;border-radius:14px;min-height:48px;padding:0 20px;font-weight:900;white-space:nowrap;transition:.2s ease}.lp-review-course-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(249,115,22,.18);color:#9a3412}.lp-review-course-btn i{color:#f59e0b;font-size:19px}.lp-review-modal{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;padding:18px}.lp-review-modal.show{display:flex}.lp-review-backdrop{position:absolute;inset:0;background:rgba(3,12,24,.72);backdrop-filter:blur(4px)}.lp-review-dialog{position:relative;width:min(720px,96vw);max-height:92vh;overflow:auto;background:#fff;border-radius:22px;padding:34px;box-shadow:0 30px 90px rgba(0,0,0,.32)}.lp-review-close{position:absolute;top:15px;right:15px;border:0;background:transparent;color:#94a3b8;font-size:26px}.lp-review-dialog h3{text-align:center;color:#1e293b;font-size:30px;font-weight:900;margin:8px 45px 18px}.lp-review-status{display:flex;align-items:center;justify-content:center;gap:8px;color:#475569;font-size:18px;margin-bottom:14px}.lp-review-status i{font-size:30px;color:#64748b}.lp-review-stars{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px 0}.lp-review-stars button{border:0;background:transparent;color:#dbe2ea;font-size:64px;line-height:1;padding:0;transition:.16s ease}.lp-review-stars button:hover,.lp-review-stars button.active{color:#ff9800;transform:scale(1.06)}.lp-review-rating-label{text-align:center;color:#ea580c;font-size:19px;font-weight:800;margin-bottom:20px}.lp-review-dialog textarea{width:100%;min-height:160px;resize:vertical;border:1px solid #d5deea;border-radius:16px;padding:16px 18px;font:inherit;line-height:1.6;outline:0;box-shadow:0 5px 15px rgba(15,23,42,.05)}.lp-review-dialog textarea:focus{border-color:#60a5fa;box-shadow:0 0 0 4px rgba(59,130,246,.12)}.lp-review-form-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}.lp-review-form-footer small{color:#64748b}.lp-review-submit{border:0;border-radius:12px;background:linear-gradient(90deg,#ff7a00,#2374ec);color:#fff;min-height:46px;padding:0 20px;font-weight:900;white-space:nowrap}.lp-review-message{margin-top:12px;border-radius:10px;padding:10px 12px;font-weight:700}.lp-review-message.success{background:#ecfdf5;color:#047857}.lp-review-message.error{background:#fff1f2;color:#be123c}.lp-review-open{overflow:hidden}
@media(max-width:900px){.lp-lesson-action-line .lp-review-course-btn{order:4;flex:1 1 150px}.lp-review-dialog h3{font-size:24px}.lp-review-stars button{font-size:50px}}
@media(max-width:575px){.lp-review-dialog{padding:26px 16px 18px;border-radius:18px}.lp-review-dialog h3{font-size:21px;margin:10px 34px 12px}.lp-review-status{font-size:15px}.lp-review-status i{font-size:24px}.lp-review-stars{gap:4px}.lp-review-stars button{font-size:44px}.lp-review-form-footer{align-items:stretch;flex-direction:column}.lp-review-submit{width:100%}.lp-review-course-btn{min-height:44px;padding:0 14px}}

/* ============================================================================
   v240 — Mobile: Hoàn thành và Đánh giá cùng một hàng; điều hướng ở hàng dưới.
   ============================================================================ */
@media (max-width:991.98px){
  .lp-lesson-action-line{
    display:grid!important;
    grid-template-columns:auto auto minmax(0,1fr) minmax(0,1fr)!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
    overflow:visible!important;
  }
  .lp-lesson-action-line .lp-meta-duration{grid-column:1;grid-row:1;min-width:0!important;}
  .lp-lesson-action-line .lp-meta-sep{grid-column:2;grid-row:1;display:inline!important;}
  .lp-lesson-action-line .lp-meta-access{grid-column:3 / 5;grid-row:1;min-width:0!important;}
  .lp-lesson-action-line .lp-progress-box{
    grid-column:1 / 3!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    margin:0!important;
    padding:7px 8px!important;
    justify-content:center!important;
    text-align:center!important;
    font-size:.78rem!important;
    white-space:nowrap!important;
  }
  .lp-lesson-action-line .lp-review-course-btn{
    grid-column:3 / 5!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    margin:0!important;
    padding:7px 8px!important;
    justify-content:center!important;
    font-size:.82rem!important;
    white-space:nowrap!important;
  }
  .lp-lesson-action-line .lp-nav-actions{
    grid-column:1 / -1!important;
    grid-row:3!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
  }
}
@media (max-width:430px){
  .lp-lesson-action-line{gap:8px!important;}
  .lp-lesson-action-line .lp-progress-box,
  .lp-lesson-action-line .lp-review-course-btn{font-size:.72rem!important;padding-left:5px!important;padding-right:5px!important;}
  .lp-lesson-action-line .lp-progress-box i,
  .lp-lesson-action-line .lp-review-course-btn i{font-size:14px!important;}
}
@media (max-width:991.98px){
  .lp-lesson-action-line.no-review .lp-progress-box{grid-column:1 / -1!important;}
}

/* ============================================================================
   v241 — Mobile: tiêu đề không bị ép viết hoa và popup Cài đặt video tự thu gọn
   vừa trong khung phát 16:9.
   ============================================================================ */
@media (max-width:575.98px){
  .lp-header-title,
  .lp-lesson-title{
    text-transform:none!important;
    font-variant:normal!important;
  }
  .lp-quality-menu.lp-quality-menu-2col{
    width:220px!important;
    min-width:0!important;
    max-width:calc(100vw - 14px)!important;
    right:-2px!important;
    bottom:36px!important;
    padding:3px!important;
    border-radius:9px!important;
    overflow:hidden!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .lp-quality-menu-2col .lp-quality-col{
    min-width:0!important;
    padding:2px 3px!important;
  }
  .lp-quality-title{
    padding:2px 3px 4px!important;
    font-size:.56rem!important;
    line-height:1.15!important;
    letter-spacing:.2px!important;
  }
  .lp-quality-menu button{
    min-height:27px!important;
    padding:3px 3px!important;
    font-size:.67rem!important;
    line-height:1.1!important;
    gap:3px!important;
    border-radius:6px!important;
  }
  .lp-quality-menu button > span{
    margin-left:3px!important;
  }
  .lp-quality-menu .q-tag{
    font-size:.49rem!important;
    letter-spacing:-.1px!important;
  }
}
@media (max-width:360px){
  .lp-quality-menu.lp-quality-menu-2col{
    width:208px!important;
    max-width:calc(100vw - 10px)!important;
  }
  .lp-quality-menu button{font-size:.64rem!important;}
}

/* ============================================================================
   v242 — Mobile: hai nút Hoàn thành/Đánh giá chia đều và tìm kiếm bài học dạng icon.
   ============================================================================ */
@media (max-width:991.98px){
  .lp-lesson-action-line{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .lp-lesson-action-line .lp-meta-duration{
    grid-column:1 / 3!important;
    grid-row:1!important;
    justify-content:flex-start!important;
    min-width:0!important;
  }
  .lp-lesson-action-line .lp-meta-sep{display:none!important}
  .lp-lesson-action-line .lp-meta-access{
    grid-column:3 / 5!important;
    grid-row:1!important;
    justify-content:center!important;
    min-width:0!important;
  }
  .lp-lesson-action-line .lp-progress-box{
    grid-column:1 / 3!important;
    width:100%!important;
  }
  .lp-lesson-action-line .lp-review-course-btn{
    grid-column:3 / 5!important;
    width:100%!important;
  }
  .lp-mobile-sidebar-title{justify-content:space-between!important;gap:10px!important}
  .lp-mobile-sidebar-title-main{display:flex;align-items:center;gap:9px;min-width:0}
  .lp-mobile-search-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    flex:0 0 38px;
    border:1px solid #cfe0f3;
    border-radius:10px;
    background:#f7fbff;
    color:var(--lp-blue);
    padding:0;
  }
  .lp-mobile-search-toggle i{font-size:18px!important;color:inherit!important}
  .lp-mobile-search-toggle:hover,.lp-mobile-search-toggle.is-open{background:#eaf4ff;border-color:#93c5fd;color:#1d4ed8}
  .lp-sidebar-search{display:none!important;padding:10px var(--lp-player-inset) 12px!important;background:#fff}
  .lp-sidebar-search.is-open{display:block!important}
}
@media (min-width:992px){
  .lp-mobile-search-toggle{display:none!important}
  .lp-sidebar-search{display:block!important}
}

/* v264 */
.lp-header-title.course-title-exact{ text-transform:none!important; font-variant:normal!important; }


/* v281: ghi chú đánh giá mobile hiển thị một dòng */
.lp-review-note-v281{white-space:nowrap}
@media(max-width:575px){
  .lp-review-form-footer .lp-review-note-v281{display:block;width:100%;font-size:12px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:clip}
}

/* v293: đồng bộ toàn bộ nhãn/nút Premium trong bài học */
.lp-btn-upgrade,
.lp-tag-premium,
.lp-badge-premium{
  background:linear-gradient(100deg,#ff8a00 0%,#ff7a1a 42%,#5268ed 100%)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 7px 18px rgba(255,122,26,.18),0 6px 16px rgba(82,104,237,.18)!important;
}
.lp-btn-upgrade:hover,
.lp-tag-premium:hover,
.lp-badge-premium:hover{
  color:#fff!important;
  filter:brightness(1.04);
}
.lp-btn-upgrade i,
.lp-tag-premium i,
.lp-badge-premium i{
  color:#fff!important;
}

/* v296: icon mua bài học rõ ràng, không dùng ô trắng */
.lp-premium-buy-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:auto;
  height:auto;
  background:transparent;
  color:#fff;
  box-shadow:none;
}
.lp-premium-buy-icon i{
  color:#fff!important;
  font-size:18px!important;
  line-height:1;
}

/* v308: tài liệu bài học nền trung tính + nút đánh giá không nhún */
.lp-doc-row{
  background:transparent!important;
  border-color:#e3eaf3!important;
  box-shadow:none!important;
}
.lp-doc-row-info{
  color:var(--lp-blue)!important;
  font-weight:800!important;
}
.lp-review-course-btn,
.lp-review-course-btn:hover,
.lp-review-course-btn:focus{
  transform:none!important;
}
.lp-review-course-btn:hover{
  box-shadow:none!important;
}

/* V468 - Typography nhẹ cho toàn bộ hàng tài liệu và thao tác bài học */
.lp-doc-row-info,
.lp-doc-download-btn,
.lp-lesson-action-line,
.lp-lesson-action-line .lp-meta-item,
.lp-lesson-action-line .lp-meta-access,
.lp-lesson-action-line .lp-tag-free,
.lp-lesson-action-line .lp-tag-premium,
.lp-lesson-action-line .lp-progress-box,
.lp-lesson-action-line .lp-progress-box strong,
.lp-lesson-action-line [data-progress-text],
.lp-lesson-action-line .lp-review-course-btn,
.lp-lesson-action-line .lp-review-course-btn span,
.lp-lesson-action-line .lp-nav-btn {
  font-weight:400!important;
}


/* V469 - Tiến trình video: tô cam đoạn đã xem và hiện thời gian tại vị trí rê chuột */
@media (max-width:575.98px){
  .lp-progress-wrap{height:22px;}
  .lp-progress-tooltip{min-width:64px;padding:5px 7px;font-size:.68rem;bottom:calc(100% + 6px);}
}