/* ═══════════════════════════════════════════════════
   WPCM Video Player v7.3.0 — Stylesheet
   ═══════════════════════════════════════════════════ */
:root{--wpcm-accent:#e50914;--wpcm-radius:12px;--wpcm-max-width:900px}

/* ── Base ── */
.wpcm-vp-wrap{position:relative;max-width:var(--wpcm-max-width);margin:1.5em auto;border-radius:var(--wpcm-radius);overflow:hidden;background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.4;outline:none}
.wpcm-vp-wrap:focus-visible{box-shadow:0 0 0 3px var(--wpcm-accent)}
.wpcm-vp-wrap *{box-sizing:border-box}
.wpcm-vp-video{display:block;width:100%;height:auto;background:#000;cursor:pointer}

/* ── States ── */
.wpcm-vp-wrap[data-state="playing"] .wpcm-vp-overlay-play,
.wpcm-vp-wrap[data-state="playing"] .wpcm-vp-spinner{display:none}
.wpcm-vp-wrap[data-state="playing"] .wpcm-vp-icon-play{display:none}
.wpcm-vp-wrap[data-state="playing"] .wpcm-vp-icon-pause{display:inline!important}

.wpcm-vp-wrap[data-state="paused"] .wpcm-vp-icon-play{display:inline}
.wpcm-vp-wrap[data-state="paused"] .wpcm-vp-icon-pause{display:none!important}
.wpcm-vp-wrap[data-state="paused"] .wpcm-vp-spinner{display:none}

.wpcm-vp-wrap[data-state="buffering"] .wpcm-vp-spinner{display:flex}
.wpcm-vp-wrap[data-state="buffering"] .wpcm-vp-overlay-play{display:none}

.wpcm-vp-wrap[data-state="idle"] .wpcm-vp-overlay-play{display:flex}
.wpcm-vp-wrap[data-state="idle"] .wpcm-vp-spinner{display:none}
.wpcm-vp-wrap[data-state="idle"] .wpcm-vp-icon-play{display:inline}
.wpcm-vp-wrap[data-state="idle"] .wpcm-vp-icon-pause{display:none!important}

.wpcm-vp-wrap[data-state="error"] .wpcm-vp-overlay-play{display:none}
.wpcm-vp-wrap[data-state="error"] .wpcm-vp-spinner{display:none}
.wpcm-vp-wrap[data-state="error"] .wpcm-vp-overlay-error{display:flex!important}

/* ── Spinner ── */
.wpcm-vp-spinner{position:absolute;inset:0;display:none;align-items:center;justify-content:center;pointer-events:none;z-index:5}
.wpcm-vp-spinner-ring{width:48px;height:48px;border:4px solid rgba(255,255,255,.25);border-top-color:var(--wpcm-accent);border-radius:50%;animation:wpcm-spin .8s linear infinite}
@keyframes wpcm-spin{to{transform:rotate(360deg)}}

/* ── Play Overlay ── */
.wpcm-vp-overlay-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:6;background:radial-gradient(circle,transparent 30%,rgba(0,0,0,.35) 100%);transition:opacity .3s}
.wpcm-vp-overlay-play:hover svg circle{fill:rgba(0,0,0,.7)}
.wpcm-vp-overlay-play svg{filter:drop-shadow(0 2px 8px rgba(0,0,0,.5));transition:transform .2s}
.wpcm-vp-overlay-play:hover svg{transform:scale(1.1)}

/* ── Error Overlay ── */
.wpcm-vp-overlay-error{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.85);z-index:20;gap:12px}
.wpcm-vp-error-msg{font-size:14px;color:#ccc;text-align:center;margin:0}
.wpcm-vp-retry-btn{padding:8px 20px;border:2px solid var(--wpcm-accent);border-radius:6px;background:transparent;color:#fff;cursor:pointer;font-size:14px;transition:background .2s}
.wpcm-vp-retry-btn:hover{background:var(--wpcm-accent)}

/* ── Resume Toast ── */
.wpcm-vp-toast{position:absolute;bottom:70px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.8);color:#fff;padding:8px 18px;border-radius:8px;font-size:13px;z-index:15;backdrop-filter:blur(6px);white-space:nowrap;cursor:pointer;transition:opacity .3s}
.wpcm-vp-toast[hidden]{display:none}

/* ── Action Toast (microinterações) ── */
.wpcm-vp-action-toast{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:25;pointer-events:none;display:flex;align-items:center;justify-content:center}
.wpcm-vp-action-toast:empty{display:none}
.wpcm-vp-action-pill{background:rgba(0,0,0,.75);color:#fff;padding:10px 22px;border-radius:8px;font-size:14px;font-weight:600;letter-spacing:.02em;backdrop-filter:blur(8px);white-space:nowrap;animation:wpcm-action-in .8s ease forwards;pointer-events:none}
@keyframes wpcm-action-in{0%{opacity:0;transform:scale(.7)}20%{opacity:1;transform:scale(1.05)}30%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.95)}}

/* ── Preview Tooltip ── */
.wpcm-vp-preview{position:absolute;bottom:55px;transform:translateX(-50%);z-index:12;display:flex;flex-direction:column;align-items:center;pointer-events:none}
.wpcm-vp-preview[hidden]{display:none}
.wpcm-vp-preview-canvas{border:2px solid var(--wpcm-accent);border-radius:4px;background:#000}
.wpcm-vp-preview-canvas.wpcm-vp-preview--sprite{display:none}
.wpcm-vp-preview-sprite{width:160px;height:90px;border:2px solid var(--wpcm-accent);border-radius:4px;background-color:#000;background-repeat:no-repeat}
.wpcm-vp-preview-time{font-size:11px;background:rgba(0,0,0,.75);padding:2px 6px;border-radius:3px;margin-top:3px}

/* ── Controls Bar ── */
.wpcm-vp-controls{position:absolute;bottom:0;left:0;right:0;padding:0 12px 8px;background:linear-gradient(transparent,rgba(0,0,0,.85));z-index:10;opacity:0;transition:opacity .3s}
.wpcm-vp-wrap:hover .wpcm-vp-controls,
.wpcm-vp-wrap:focus-within .wpcm-vp-controls,
.wpcm-vp-wrap[data-state="paused"] .wpcm-vp-controls,
.wpcm-vp-wrap[data-state="idle"] .wpcm-vp-controls{opacity:1}
.wpcm-vp-wrap[data-state="playing"].wpcm-vp-idle{cursor:none}
.wpcm-vp-wrap[data-state="playing"].wpcm-vp-idle .wpcm-vp-controls{opacity:0;pointer-events:none}

/* ── Progress ── */
.wpcm-vp-progress-wrap{position:relative;width:100%;height:18px;display:flex;align-items:center;cursor:pointer}
.wpcm-vp-progress-bar{position:relative;width:100%;height:4px;background:rgba(255,255,255,.2);border-radius:2px;overflow:visible;transition:height .15s}
.wpcm-vp-progress-wrap:hover .wpcm-vp-progress-bar{height:6px}
.wpcm-vp-buffered{position:absolute;top:0;left:0;height:100%;background:rgba(255,255,255,.3);border-radius:2px;width:0;pointer-events:none}
.wpcm-vp-progress{position:absolute;top:0;left:0;height:100%;background:var(--wpcm-accent);border-radius:2px;width:0;pointer-events:none}
.wpcm-vp-progress-handle{position:absolute;top:50%;left:0;width:14px;height:14px;background:var(--wpcm-accent);border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%) scale(0);transition:transform .15s;pointer-events:none;z-index:2}
.wpcm-vp-progress-wrap:hover .wpcm-vp-progress-handle{transform:translate(-50%,-50%) scale(1)}

/* ── Controls Row ── */
.wpcm-vp-controls-row{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:4px}
.wpcm-vp-controls-left,.wpcm-vp-controls-right{display:flex;align-items:center;gap:4px}

/* ── Buttons ── */
.wpcm-vp-btn{background:transparent;border:none;color:#fff;cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s;line-height:1}
.wpcm-vp-btn:hover,.wpcm-vp-btn:focus-visible{background:rgba(255,255,255,.15)}
.wpcm-vp-btn:focus-visible{outline:2px solid var(--wpcm-accent);outline-offset:2px}

/* ── Volume ── */
.wpcm-vp-volume-group{display:flex;align-items:center;gap:2px}
.wpcm-vp-volume-slider{-webkit-appearance:none;appearance:none;width:0;height:4px;background:rgba(255,255,255,.3);border-radius:2px;outline:none;cursor:pointer;transition:width .25s,opacity .25s;opacity:0}
.wpcm-vp-volume-group:hover .wpcm-vp-volume-slider{width:70px;opacity:1}
.wpcm-vp-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#fff;border-radius:50%;cursor:pointer}
.wpcm-vp-volume-slider::-moz-range-thumb{width:12px;height:12px;background:#fff;border-radius:50%;border:none;cursor:pointer}

/* ── Time ── */
.wpcm-vp-time{font-size:12px;font-variant-numeric:tabular-nums;opacity:.85;padding:0 4px;white-space:nowrap;user-select:none}

/* ── Gear Menu ── */
.wpcm-vp-gear-wrap{position:relative}
.wpcm-vp-gear-menu{position:absolute;bottom:calc(100% + 8px);right:0;background:rgba(20,20,20,.95);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:10px;min-width:180px;backdrop-filter:blur(12px);z-index:30}
.wpcm-vp-gear-menu[hidden]{display:none}
.wpcm-vp-gear-section{margin-bottom:8px}
.wpcm-vp-gear-section:last-child{margin-bottom:0}
.wpcm-vp-gear-title{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.5);margin-bottom:6px}
.wpcm-vp-speed-options,.wpcm-vp-quality-options{display:flex;flex-wrap:wrap;gap:4px}
.wpcm-vp-speed-opt,.wpcm-vp-quality-opt{padding:3px 8px;font-size:12px;border-radius:4px}
.wpcm-vp-speed-opt.active,.wpcm-vp-quality-opt.active{background:var(--wpcm-accent);color:#fff}

/* ── Embed Wrapper ── */
.wpcm-vp-embed-wrap{aspect-ratio:16/9}
.wpcm-vp-embed-inner{position:relative;width:100%;height:100%;overflow:hidden}
.wpcm-vp-embed-inner iframe{position:absolute;top:-60px;left:0;width:100%;height:calc(100% + 120px);border:0}
.wpcm-vp-embed-overlay{position:absolute;inset:0;z-index:4;cursor:pointer}
.wpcm-vp-embed-controls{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:linear-gradient(transparent,rgba(0,0,0,.8));z-index:10;opacity:0;transition:opacity .3s}
.wpcm-vp-embed-wrap:hover .wpcm-vp-embed-controls{opacity:1}

/* ── Responsive ── */
@media(max-width:600px){
    .wpcm-vp-controls-row{gap:2px}
    .wpcm-vp-time{font-size:11px}
    .wpcm-vp-btn svg{width:18px;height:18px}
    .wpcm-vp-gear-menu{min-width:150px;padding:8px}
    .wpcm-vp-toast{font-size:11px;bottom:60px}
    .wpcm-vp-volume-group:hover .wpcm-vp-volume-slider{width:50px}
}
@media(max-width:400px){
    .wpcm-vp-skip-bk,.wpcm-vp-skip-fw{display:none}
}
