/* VPI Player Skin (05/10/2026) - giao dien moi cho bo dieu khien JW (player-ver2), mau chu dao: --vpi-accent */
.jwplayer.jwplayer { --vpi-a: var(--vpi-accent, #f6821f); font-family: inherit !important; border-radius: 12px; overflow: hidden; }
.jwplayer.jwplayer .jw-controls { background: none !important; }
.jwplayer.jwplayer .jw-controls-backdrop { background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.45) 22%, rgba(0,0,0,0) 45%) !important; }
/* nut play giua man hinh: kinh mo */
.jwplayer.jwplayer .jw-display-icon-container,
.jwplayer.jwplayer .jw-icon-display {
    background: rgba(0,0,0,.42) !important; border: 1px solid rgba(255,255,255,.28) !important;
    border-radius: 50% !important; box-shadow: 0 10px 30px rgba(0,0,0,.45) !important;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background .2s ease, transform .2s ease !important;
}
.jwplayer.jwplayer .jw-display-icon-display { width: 76px !important; height: 76px !important; }
.jwplayer.jwplayer .jw-display-icon-display .jw-icon-display { width: 76px !important; height: 76px !important; border: 0 !important; background: none !important; box-shadow: none !important; }
.jwplayer.jwplayer .jw-display-icon-display .jw-svg-icon { width: 34px !important; height: 34px !important; }
.jwplayer.jwplayer .jw-display-icon-container:hover { background: var(--vpi-a) !important; border-color: var(--vpi-a) !important; transform: scale(1.06); }
.jwplayer.jwplayer .jw-display-icon-rewind, .jwplayer.jwplayer .jw-display-icon-next { background: rgba(0,0,0,.32) !important; }
/* thanh tien trinh */
.jwplayer.jwplayer .jw-slider-time { padding: 0 14px !important; height: 22px !important; }
.jwplayer.jwplayer .jw-slider-time .jw-rail,
.jwplayer.jwplayer .jw-slider-time .jw-buffer,
.jwplayer.jwplayer .jw-slider-time .jw-progress { height: 4px !important; border-radius: 4px !important; transition: height .15s ease; }
.jwplayer.jwplayer .jw-slider-time:hover .jw-rail,
.jwplayer.jwplayer .jw-slider-time:hover .jw-buffer,
.jwplayer.jwplayer .jw-slider-time:hover .jw-progress { height: 6px !important; }
.jwplayer.jwplayer .jw-rail { background: rgba(255,255,255,.22) !important; }
.jwplayer.jwplayer .jw-buffer { background: rgba(255,255,255,.38) !important; }
.jwplayer.jwplayer .jw-progress { background: var(--vpi-a) !important; }
.jwplayer.jwplayer .jw-slider-time .jw-knob {
    width: 14px !important; height: 14px !important; margin-top: -1px; background: #fff !important;
    border: 3px solid var(--vpi-a) !important; box-shadow: 0 0 0 4px rgba(255,255,255,.15), 0 2px 8px rgba(0,0,0,.5) !important;
    opacity: 0; transition: opacity .15s ease; box-sizing: border-box;
}
.jwplayer.jwplayer .jw-slider-time:hover .jw-knob, .jwplayer.jwplayer.jw-flag-touch .jw-slider-time .jw-knob { opacity: 1; }
.jwplayer.jwplayer .jw-time-tip .jw-time-tip-text, .jwplayer.jwplayer .jw-tooltip .jw-text { background: var(--vpi-a) !important; color: #fff !important; border-radius: 6px !important; font-weight: 700; }
.jwplayer.jwplayer .jw-time-tip::after, .jwplayer.jwplayer .jw-tooltip::after { border-top-color: var(--vpi-a) !important; }
/* hang nut */
.jwplayer.jwplayer .jw-controlbar { padding: 0 6px 4px !important; }
.jwplayer.jwplayer .jw-button-container { padding: 0 8px !important; }
.jwplayer.jwplayer .jw-controlbar .jw-icon-inline,
.jwplayer.jwplayer .jw-controlbar .jw-icon-tooltip { color: rgba(255,255,255,.92) !important; border-radius: 8px; transition: color .15s ease, background .15s ease; }
.jwplayer.jwplayer .jw-controlbar .jw-icon-inline:hover,
.jwplayer.jwplayer .jw-controlbar .jw-icon-tooltip:hover { color: var(--vpi-a) !important; background: rgba(255,255,255,.08); }
.jwplayer.jwplayer .jw-controlbar .jw-icon-inline:hover .jw-svg-icon { fill: var(--vpi-a) !important; }
.jwplayer.jwplayer .jw-controlbar .jw-icon-rewind { display: none !important; } /* trung voi nut "Back 10s" ben phai */
.jwplayer.jwplayer .jw-text-elapsed, .jwplayer.jwplayer .jw-text-duration, .jwplayer.jwplayer .jw-text-alt {
    font-size: 13px !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; color: #fff !important; letter-spacing: .2px;
}
.jwplayer.jwplayer .jw-text-duration { color: rgba(255,255,255,.65) !important; }
/* menu cai dat */
.jwplayer.jwplayer .jw-settings-menu {
    background: rgba(20,20,20,.92) !important; border: 1px solid rgba(255,255,255,.1); border-radius: 12px !important;
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0,0,0,.5); overflow: hidden;
}
.jwplayer.jwplayer .jw-settings-content-item { border-radius: 8px; }
.jwplayer.jwplayer .jw-settings-content-item:hover, .jwplayer.jwplayer .jw-settings-item-active { color: var(--vpi-a) !important; }
.jwplayer.jwplayer .jw-settings-item-active::before { color: var(--vpi-a) !important; }
.jwplayer.jwplayer .jw-settings-topbar { background: rgba(255,255,255,.04) !important; }
.jwplayer.jwplayer .jw-slider-volume .jw-progress, .jwplayer.jwplayer .jw-slider-volume .jw-knob { background: var(--vpi-a) !important; }
/* dien thoai: nut vua tay, chu gon */
@media (max-width: 600px) {
    .jwplayer.jwplayer { border-radius: 0; }
    .jwplayer.jwplayer .jw-display-icon-display, .jwplayer.jwplayer .jw-display-icon-display .jw-icon-display { width: 64px !important; height: 64px !important; }
    .jwplayer.jwplayer .jw-display-icon-display .jw-svg-icon { width: 28px !important; height: 28px !important; }
    .jwplayer.jwplayer .jw-controlbar .jw-icon-inline, .jwplayer.jwplayer .jw-controlbar .jw-icon-tooltip { width: 40px !important; height: 40px !important; }
    .jwplayer.jwplayer .jw-controlbar .jw-svg-icon { width: 22px !important; height: 22px !important; }
    .jwplayer.jwplayer .jw-text-elapsed, .jwplayer.jwplayer .jw-text-duration, .jwplayer.jwplayer .jw-text-alt { font-size: 12.5px !important; }
    .jwplayer.jwplayer .jw-slider-time { padding: 0 10px !important; }
}
/* trinh phat noi khi cuon (may tinh) */
.jwplayer.jw-flag-floating .jw-wrapper { border-radius: 12px !important; overflow: hidden; box-shadow: 0 16px 40px rgba(0,0,0,.6) !important; }
.jwplayer.jwplayer .jw-float-bar { background: rgba(0,0,0,.6) !important; }
.jwplayer.jwplayer .jw-float-icon { border-radius: 50%; }
/* can giua nut play: JW tu them padding 5.5px cho khung -> icon lech ~7px. Bo padding, can bang flex. */
.jwplayer.jwplayer .jw-display-icon-container { padding: 0 !important; box-sizing: border-box !important; }
.jwplayer.jwplayer .jw-display-icon-container .jw-icon {
    width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important;
}
.jwplayer.jwplayer .jw-display-icon-container .jw-svg-icon { margin: 0 !important; }
.jwplayer.jwplayer .jw-display-icon-display .jw-svg-icon-play { transform: translateX(2px); } /* can thi giac tam giac */
.jwplayer.jwplayer .jw-display-icon-rewind, .jwplayer.jwplayer .jw-display-icon-next { width: 52px !important; height: 52px !important; }
/* thong bao "Xem tiep tu ..." tren trinh phat (05/10/2026) */
.jwplayer .vpi-resume-toast {
    position: absolute !important; left: 14px !important; bottom: 62px !important; z-index: 25 !important;
    display: flex !important; align-items: center !important; gap: 10px !important; flex-wrap: wrap;
    max-width: calc(100% - 28px); padding: 8px 8px 8px 12px !important; border-radius: 14px !important;
    background: rgba(18,18,18,.72) !important; border: 1px solid rgba(255,255,255,.14) !important;
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    box-shadow: 0 10px 28px rgba(0,0,0,.5) !important; color: #fff !important;
    font: 600 13.5px/1.3 Arial, Helvetica, sans-serif !important;
    animation: vpiRtIn .35s ease both; transition: opacity .4s ease !important;
}
@keyframes vpiRtIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.jwplayer .vpi-resume-toast .vpi-rt-ic { display: flex; color: var(--vpi-accent, #f6821f); }
.jwplayer .vpi-resume-toast .vpi-rt-txt { white-space: nowrap; color: rgba(255,255,255,.88); }
.jwplayer .vpi-resume-toast .vpi-rt-txt b { color: #fff; font-weight: 800; font-variant-numeric: tabular-nums; margin-left: 2px; }
.jwplayer .vpi-resume-toast button {
    border: 0 !important; border-radius: 999px !important; padding: 7px 14px !important; margin: 0 !important; cursor: pointer;
    font: 700 12.5px/1 Arial, Helvetica, sans-serif !important; transition: transform .12s ease, background .15s ease, border-color .15s ease;
}
.jwplayer .vpi-resume-toast .vpi-rt-go { background: var(--vpi-accent, #f6821f) !important; color: #fff !important; box-shadow: 0 4px 14px rgba(0,0,0,.35); }
.jwplayer .vpi-resume-toast .vpi-rt-go:hover { filter: brightness(1.1); transform: translateY(-1px); }
.jwplayer .vpi-resume-toast .vpi-rt-restart { background: transparent !important; color: #fff !important; border: 1px solid rgba(255,255,255,.35) !important; }
.jwplayer .vpi-resume-toast .vpi-rt-restart:hover { border-color: var(--vpi-accent, #f6821f) !important; color: var(--vpi-accent, #f6821f) !important; }
@media (max-width: 600px) {
    .jwplayer .vpi-resume-toast {
        left: 8px !important; right: 8px !important; transform: none !important; max-width: none; width: auto;
        top: 8px !important; bottom: auto !important; justify-content: center !important; flex-wrap: nowrap !important; animation: vpiRtDown .35s ease both !important;
        gap: 7px !important; padding: 5px 5px 5px 9px !important; border-radius: 999px !important; font-size: 12px !important;
    }
    .jwplayer .vpi-resume-toast .vpi-rt-ic svg { width: 15px; height: 15px; }
    .jwplayer .vpi-resume-toast button { padding: 6px 10px !important; font-size: 11.5px !important; white-space: nowrap; }
}
@media (max-width: 360px) { .jwplayer .vpi-resume-toast .vpi-rt-ic { display: none; } }
/* dien thoai: thong bao nam o MEP TREN video (khong de nut play giua, khong che thanh dieu khien o duoi) */
@keyframes vpiRtDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
/* thong bao xem tiep an cung luc voi bo dieu khien JW (jw-flag-user-inactive) */
.jwplayer.jw-flag-user-inactive.jw-state-playing .vpi-resume-toast { opacity: 0 !important; pointer-events: none; }

/* 06/10/2026: Safari iPhone - an giu (2x) khong bat menu he thong / boi den chu trong khung player */
.jwplayer, .jwplayer * { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.jwplayer { -webkit-tap-highlight-color: transparent; }