.amv-html5-player{position:relative;max-width:100%;background:#000;color:#fff;border-radius:12px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.35),0 4px 8px rgba(0,0,0,.2)}
.amv-video{width:100%;height:auto;display:block;background:#000}
.amv-controls{display:flex;align-items:center;gap:10px;padding:10px;background:rgba(0,0,0,.62);backdrop-filter:saturate(120%) blur(2px)}
.amv-html5-player:not(.amv-controls-visible) .amv-controls{opacity:0;pointer-events:none;transition:opacity .2s ease}
.amv-html5-player.amv-controls-visible .amv-controls{opacity:1;transition:opacity .2s ease}
.amv-btn{width:35px;height:35px;border:0;background:#222;border-radius:6px;cursor:pointer;box-shadow:none;outline:none}
.amv-btn:focus{outline:none}
.amv-btn:hover{filter:brightness(1.1)}
.amv-btn:active{transform:scale(0.98)}
.amv-btn.amv-play{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/play-button.png") no-repeat center center/20px}
.amv-btn.amv-pause{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/pause-button.png") no-repeat center center/20px}
.amv-btn.amv-mute{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/volume-icon.png") no-repeat center center/20px}
.amv-btn.amv-mute.is-muted{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/volume-icon-disabled.png") no-repeat center center/20px}
.amv-btn.amv-fullscreen{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/full-screen.png") no-repeat center center/20px}
.amv-time{color:#ddd;font:14px/1.3 sans-serif;display:flex;gap:6px;align-items:center}
.amv-progress{position:relative;flex:1;height:6px;background:#333;border-radius:3px;cursor:pointer}
.amv-progress .amv-buffered{position:absolute;left:0;top:0;height:100%;width:0;background:#555;border-radius:3px}
.amv-progress .amv-played{position:absolute;left:0;top:0;height:100%;width:0;background:#e53935;border-radius:3px}
.amv-progress .amv-seek-tooltip{position:absolute;bottom:140%;transform:translateX(-50%);background:rgba(0,0,0,.86);color:#fff;padding:3px 8px;border-radius:6px;font:11px/1 sans-serif;pointer-events:none;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.35);z-index:5;opacity:0;visibility:hidden;transition:opacity .15s ease}
.amv-progress:hover .amv-seek-tooltip{opacity:1;visibility:visible}
.amv-progress .amv-seek-tooltip[aria-hidden="true"]{opacity:0;visibility:hidden}
.amv-progress .amv-seek-tooltip[aria-hidden="false"]{opacity:1;visibility:visible}
.amv-progress .amv-preview{position:absolute;bottom:150%;left:0;transform:translateX(-50%);width:160px;height:90px;background:#000;border:1px solid #444;border-radius:6px;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,.35);opacity:0;visibility:hidden;transition:opacity .15s ease;z-index:6}
.amv-progress .amv-preview-img{width:100%;height:100%;object-fit:cover;display:block}
.amv-progress:hover .amv-preview{opacity:1;visibility:visible}
.amv-progress .amv-preview[aria-hidden="true"]{opacity:0;visibility:hidden}
.amv-progress .amv-preview[aria-hidden="false"]{opacity:1;visibility:visible}
.amv-volume{display:flex;align-items:center;gap:8px;margin-left:8px}
.amv-volume-range{width:120px;height:8px;vertical-align:middle}

/* Volume range styling */
.amv-volume-range{-webkit-appearance:none;background:#444;border-radius:4px;outline:none}
.amv-volume-range::-webkit-slider-runnable-track{height:8px;background:#444;border-radius:4px}
.amv-volume-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid #222;margin-top:-4px;cursor:pointer}
.amv-volume-range::-moz-range-track{height:8px;background:#444;border-radius:4px}
.amv-volume-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid #222;cursor:pointer}
.amv-volume-range::-ms-track{height:8px;background:transparent;border-color:transparent;color:transparent}
.amv-volume-range::-ms-fill-lower{background:#444;border-radius:4px}
.amv-volume-range::-ms-fill-upper{background:#444;border-radius:4px}
.amv-volume-range::-ms-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid #222;cursor:pointer}
.amv-speed{margin-left:6px}
.amv-speed-select{background:#000 !important;color:#fff !important;border:1px solid #444 !important;border-radius:6px;height:35px;box-shadow:none;padding:0 28px 0 34px;appearance:none;-webkit-appearance:none;-moz-appearance:none}
.amv-speed-select:focus{outline:none !important;box-shadow:0 0 0 2px rgba(255,255,255,.08);border-color:#666 !important}
.amv-speed-select option{background:#000 !important;color:#fff !important}
.amv-quality{margin-left:6px}
.amv-quality-select{background:#222;color:#fff;border:0;border-radius:6px;height:28px}
.amv-captions{margin-left:6px}
.amv-captions-select{background:#222;color:#fff;border:0;border-radius:6px;height:28px}
.amv-select-icon{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#222;border:0;border-radius:6px;height:35px;min-width:35px;width:35px;padding:0;margin:0;cursor:pointer;box-shadow:none}
/* hide visible text in the closed select across browsers */
.amv-select-icon{color:transparent;text-shadow:0 0 0 transparent;font-size:0;line-height:0;-webkit-text-fill-color:transparent;text-indent:-9999px;overflow:hidden}
/* Override hidden text for Speed select so its value shows */
.amv-speed-select.amv-select-icon{color:#fff !important;text-shadow:none !important;font-size:13px !important;line-height:1.2 !important;-webkit-text-fill-color:#fff !important;text-indent:0 !important;overflow:visible !important}
.amv-select-icon::-ms-value{color:transparent}
.amv-select-icon::-ms-expand{display:none}
/* restore font size in the dropdown list */
.amv-select-icon option{font-size:13px;line-height:1.2;color:#111}
.amv-select-icon:focus,.amv-select-icon:active{color:transparent;outline:0}
.amv-speed,.amv-quality,.amv-captions{position:relative}
.amv-speed:before,.amv-quality:before,.amv-captions:before{content:"";position:absolute;left:9px;top:8px;width:18px;height:18px;background-repeat:no-repeat;background-size:18px 18px;z-index:2;pointer-events:none}
/* Replace speed text with playback rate png */
.amv-speed:before{background-image:url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/playback-rate-normal.png")}
.amv-quality:before{background-image:url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/combobox-arrow-normal.png")}    
.amv-captions:before{background-image:url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/info-button.png")}

/* Theater mode */
.amv-html5-player.amv-theater{max-width:none;width:100%}
.amv-html5-player.amv-theater .amv-video{width:100%}

/* Expand to full viewport width even inside constrained columns */
.amv-theater-mode .amv-html5-player.amv-theater{
  position: relative;
  z-index: 3;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 0;
  box-sizing: border-box;
}
/* Maintain aspect ratio by letting the video scale; cap height for usability */
.amv-theater-mode .amv-html5-player.amv-theater .amv-video{
  width: 100% !important;
  height: 85vh !important;
  max-height: 85vh !important;
  object-fit: cover;
  background: #000;
  display: block;
}
/* Keep playlist panel usable in theater */
.amv-theater-mode .amv-html5-player.amv-theater .amv-side{height:100%}
.amv-html5-player .amv-btn.amv-theater{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/full-screen.png") no-repeat center center/20px}
.amv-html5-player .amv-btn.amv-pip{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/popup-button.png") no-repeat center center/20px}
.amv-fullscreen{margin-left:auto}

/* Playlist side panel */
.amv-btn.amv-playlist{background:#222 url("{$jamroom_url}/modules/jrVideo/img/minimal_skin_dark/playlist-button.png") no-repeat center center/20px}

/* Tooltips above icons/selects */
.amv-btn[data-tooltip], .amv-select-icon[data-tooltip] { position: relative }
.amv-btn[data-tooltip]::after, .amv-select-icon[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, -8px);
  background: #000;
  color: #fff;
  padding: 4px 8px;
  border-radius: 6px;
  font: 12px/1 sans-serif;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10;
  transition: opacity .15s ease;
}
.amv-btn[data-tooltip]::before, .amv-select-icon[data-tooltip]::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 2px);
  border: 6px solid transparent;
  border-top-color: #000;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10;
  transition: opacity .15s ease;
}
.amv-btn[data-tooltip]:hover::after, .amv-btn[data-tooltip]:hover::before,
.amv-select-icon[data-tooltip]:hover::after, .amv-select-icon[data-tooltip]:hover::before {
  opacity: 1;
  visibility: visible;
}

/* Wrapper-based tooltip support (for selects on some browsers) */
.amv-has-tooltip{position:relative}
.amv-has-tooltip::after{
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, -8px);
  background: #000;
  color: #fff;
  padding: 4px 8px;
  border-radius: 6px;
  font: 12px/1 sans-serif;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10;
  transition: opacity .15s ease;
}
.amv-has-tooltip::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 2px);
  border: 6px solid transparent;
  border-top-color: #000;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 10;
  transition: opacity .15s ease;
}
.amv-has-tooltip:hover::after, .amv-has-tooltip:hover::before{opacity:1;visibility:visible}

/* Stronger specificity to keep text white on selects */
.amv-html5-player .amv-speed .amv-speed-select,
.amv-html5-player .amv-quality .amv-quality-select,
.amv-html5-player .amv-captions .amv-captions-select{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:#000 !important;
  border-color:#444 !important;
}
.amv-side{position:absolute;right:0;top:0;width:33%;height:100%;background:rgba(10,10,10,.96);border-left:1px solid #333;transform:translateX(100%);transition:transform .2s ease;z-index:1;display:flex;flex-direction:column;pointer-events:none}
.amv-html5-player.amv-side-open .amv-side{transform:translateX(0);z-index:3;pointer-events:auto}
.amv-side-header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid #333;font:13px/1.2 sans-serif}
.amv-side-close{background:none;border:0;color:#fff;font-size:20px;cursor:pointer}
.amv-side-content{flex:1;overflow:auto}

/* Playlist items */
.amv-pl{display:block}
.amv-pl-item{display:flex;gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid #2a2a2a;color:#fff;text-decoration:none}
.amv-pl-item:hover{background:#111}
.amv-pl-item.is-current{background:#0f172a}
.amv-pl-thumb{width:100px;height:56px;flex:0 0 100px;border-radius:6px;overflow:hidden;background:#222;display:block}
.amv-pl-img{width:100%;height:100%;object-fit:cover;display:block}
.amv-pl-noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,#333,#222)}
.amv-pl-meta{display:flex;flex-direction:column;min-width:0}
.amv-pl-title{font:13px/1.3 sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.amv-pl-sub{font:11px/1.2 sans-serif;color:#bbb;display:flex;gap:6px;align-items:center}
.amv-pl-dot{opacity:.75}
.amv-pl-empty{padding:12px;color:#bbb;font:12px/1.2 sans-serif}