/* =========================
   WATCH (single movies)
   ========================= */
:root{
  --bg:#0f141c;
  --bg-2:#11171F;
  --panel:#0c1118;
  --line:#223047;
  --text:#e6eef8;
  --muted:#9fb0c8;
  --accent:#E50914;   /* main red */
  --warn:#ff9f1a;     /* amber outline */
  --shadow:0 18px 50px rgba(0,0,0,1);
  --r:16px;
}

/* ---------- Page ---------- */
.bs-watch-page{
  padding:24px 16px;
  background:var(--bg-2);
}
.bs-watch{
  max-width:1200px;
  margin:0 auto;
}
.bs-watch__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
}
.bs-watch__title{
  color:var(--text);
  font-size:22px;
  font-weight:800;
  margin:0;
}
.bs-badges{
  display:flex;
  gap:8px;
}
.bs-badge{
  display:inline-block;
  padding:6px 10px;
  border-radius:10px;
  font-weight:800;
  font-size:12px;
}
.bs-badge--price{
  background:var(--accent);
  color:#fff;
}
.bs-badge--dur{
  background:#1a2230;
  color:#fff;
  border:1px solid #202a39;
}

/* ---------- Player ---------- */
.player-wrap{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r);
  box-shadow:var(--shadow);
  padding:8px;
  max-width:1200px;
  margin:16px auto;
}
.player-wrap video{
  width:100%;
  border-radius:12px;
  outline:none;
}

/* ---------- Gate (locked) ---------- */
.bs-locked{
  background:#0c1118;
  border:1px solid #223047;
  border-radius:16px;
  max-width:980px;
  margin:28px auto;
  padding:32px;
  box-shadow:0 22px 60px rgba(0,0,0,1);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}
.bs-locked__icon{
  width:50px;
  height:50px;
  border-radius:999px;
  border:3px solid #E50914;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#E3EBF4;
  font-weight:900;
}
.bs-locked__text{
  color:#E3EBF4;
  margin:0;
  font-size:16px;
}

/* Buttons (CTA + auth) — base */
.bs-locked__btn,.bs-auth-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 22px;
  border:1px solid #E50914;
  border-radius:14px;
  background:#1A2430;
  color:#E3EBF4;
  font-weight:800;
  letter-spacing:.2px;
  text-decoration:none;
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .12s ease;
}
/* Hover → main menu red */
.bs-locked__btn:hover,.bs-auth-actions
  a:hover{background:#1A2430;
  border-color:#E50914;
  color:#E3EBF4;
  box-shadow:0 8px 24px rgba(229,9,20,.35);
  transform:translateY(-1px);
}
.bs-locked__btn:active,.bs-auth-actions 
  a:active{transform:translateY(0);
  box-shadow:0 4px 14px rgba(229,9,20,.25);
}
.bs-locked__btn:focus-visible,.bs-auth-actions a:focus-visible{
  outline:2px solid rgba(229,9,20,.35);
  outline-offset:2px;
}

/* Auth button group */
.bs-auth-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
}

/* ---------- Responsive ---------- */
@media (max-width:720px){
  .bs-watch__title{font-size:20px;}
  .bs-locked{margin:16px auto;padding:20px;}
}
/* /assets/css/watch.css гэх мэтэд */
@media print {
  .bs-watch-player { display:none !important; }
  .bs-watch-guard { display:block !important; } /* "Энэ контент принт хамгаалалттай" гэж текст гаргаж болно */
}
/* ==== Per-user watermark (BubbleStory) ==== */

.bs-watch-wrapper--watermark {
  position: relative; /* watermark давхарлаж байрлуулахаар */
}

.bs-watch-wrapper--watermark .bs-watermark {
  position: absolute;
  top: 12%;
  left: 10%;
  padding: 4px 10px;
  font-size: 16px;
  font-weight: 700;
  color: rgba(255,255,255,0.35);
  pointer-events: none;
  z-index: 9999;
  text-shadow: 0 0 3px rgba(0,0,0,.8);
  mix-blend-mode: screen;
  animation: bs-watermark-move 40s linear infinite;
}

/* Усан тэмдэг аажмаар байрлал сольж байна */
@keyframes bs-watermark-move {
  0%   { top: 12%; left: 10%; }
  25%  { top: 25%; left: 60%; }
  50%  { top: 55%; left: 18%; }
  75%  { top: 72%; left: 50%; }
  100% { top: 12%; left: 10%; }
}