/* Trang chi tiết phim — số đo theo motchille.film/phim/{slug} (SPEC §6, không quảng cáo). */
.mv{padding-top:8px;padding-bottom:8px}

/* backdrop 300px */
.mv-hero{position:relative;width:100%;height:300px;max-height:300px;overflow:hidden}
.mv-hero__a{position:absolute;inset:0;z-index:10;display:block}
.mv-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (min-width:768px){.mv-hero__img{filter:blur(4px)}}
.mv-hero__shade{position:absolute;inset:0;background:linear-gradient(to top,#000,rgba(0,0,0,.5),transparent)}
.mv-hero__c{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-bottom:80px}
.mv-hero__play{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:9999px;background:#ff7e08;color:#fff;transition:background .15s var(--mc-ease)}
.mv-hero__a:hover .mv-hero__play{background:rgba(255,126,8,.9)}

/* khối trên: poster + thông tin, kéo lên đè backdrop 128px */
.mv-body{position:relative;z-index:10;margin-top:-128px}
.mv-top{display:flex;flex-direction:column;gap:32px}
@media (min-width:768px){.mv-top{flex-direction:row}}
.mv-poster{display:none}
@media (min-width:768px){.mv-poster{display:block;width:25%}}
@media (min-width:1024px){.mv-poster{width:20%}}
.mv-poster__img{position:relative;aspect-ratio:2/3;border-radius:var(--mc-r-lg);overflow:hidden;background:var(--mc-gray-800);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.mv-poster__img img{width:100%;height:100%;object-fit:cover}
.mv-info{width:100%;min-width:0}
@media (min-width:768px){.mv-info{width:75%}}
@media (min-width:1024px){.mv-info{width:80%}}

.mv-title{margin-bottom:8px;font-size:30px;line-height:36px;font-weight:700}
@media (min-width:768px){.mv-title{font-size:36px;line-height:40px}}
.mv-origin{margin-bottom:16px;font-size:20px;line-height:28px;font-weight:400;color:var(--mc-gray-400)}
.mv-info .mc-bc{margin:0 0 16px}
.mv-info .mc-bc li:last-child{max-width:150px}
@media (min-width:768px){.mv-info .mc-bc li:last-child{max-width:80rem}}

.mv-actions{display:flex;gap:16px;margin-bottom:16px}
.mv-actions:empty{display:none}
.mv-trailer-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:8px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.045);box-shadow:0 1px 2px rgba(0,0,0,.05);font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;transition:background .15s var(--mc-ease)}
.mv-trailer-btn:hover{background:rgba(255,255,255,.075)}
.mv-watch{display:none}
@media (min-width:768px){.mv-watch{display:block}}
.mv-watch a{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--mc-r);background:#ff7e08;color:#fff;font-size:14px;line-height:20px;font-weight:500;transition:background .15s var(--mc-ease)}
.mv-watch a:hover{background:rgba(255,126,8,.9)}

.mv-notice{width:100%;margin-bottom:16px;padding:8px 0;border:1px dashed var(--mc-orange-400)}
.mv-notice>span{display:block;margin:8px}
.mv-notice a{text-decoration:underline;text-decoration-color:var(--mc-orange-400)}

.mv-meta{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.mv-meta:empty{display:none}
.mv-q{padding:4px 8px;border-radius:var(--mc-r);background:var(--mc-yellow-500);color:#000;font-size:12px;line-height:16px;font-weight:700}

/* đánh giá sao */
.mv-rating{margin-bottom:16px}
.mv-stars{display:flex;align-items:center;gap:4px}
.mv-star{display:flex;flex:0 1 24px;min-width:0;height:24px;color:#4a5565;transition:color .15s var(--mc-ease)}
.mv-star svg{width:100%;height:100%;fill:currentColor;stroke:currentColor;stroke-width:1}
.mv-star.is-on,.mv-stars.is-hover .mv-star.is-hl{color:var(--mc-yellow-400)}
.mv-stars.is-hover .mv-star:not(.is-hl){color:#4a5565}
.mv-stars.is-done .mv-star{cursor:default}
.mv-rating__text{margin-left:4px;font-size:12px;line-height:16px;color:rgba(255,255,255,.7);white-space:nowrap}
@media (min-width:640px){.mv-rating__text{font-size:14px;line-height:20px}}

.mv-views{display:flex;align-items:center;margin-bottom:16px}
.mv-views span{margin-left:4px}
/* Hàng chia sẻ: mẫu là hàng chữ trơn (mt-24 gap-16), khối nền xám 50px cạnh đó là ô quảng cáo nên bỏ. */
.mv-share{display:flex;align-items:center;gap:16px;margin:24px 0 16px;font-size:14px;line-height:20px;color:#fff}
.mv-share__l{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.mv-share a{transition:color .15s}
.mv-share a:hover{color:var(--mc-accent)}

/* thể loại / quốc gia */
.mv-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.mv-row__l{margin-bottom:8px;font-size:18px;line-height:28px;font-weight:700}
.mv-pills{display:flex;flex-wrap:wrap;gap:8px}
.mv-pill{padding:4px 8px;border-radius:9999px;background:var(--mc-gray-800);font-size:14px;line-height:20px;transition:background .2s}
.mv-pills a:hover .mv-pill{background:var(--mc-gray-700)}

/* diễn viên / đạo diễn */
.mv-cast{margin-bottom:16px}
.mv-cast__in{margin-bottom:32px}
.mv-cast:last-child,.mv-cast:last-child .mv-cast__in{margin-bottom:0}
.mv-cast__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.mv-cast__t{font-size:18px;line-height:28px;font-weight:700}
.mv-cast__t--h{margin-bottom:8px}
.mv-cast__track{overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none}
.mv-cast__track::-webkit-scrollbar{display:none}
.mv-cast__row{display:flex;gap:16px}
.mv-person{flex:none;display:block;width:80px;text-align:center}
.mv-person__av{display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin:0 auto;border-radius:9999px;overflow:hidden;border:2px solid transparent;background:var(--mc-gray-800);color:var(--mc-gray-500);transition:border-color .15s var(--mc-ease)}
.mv-person__av svg{width:40%;height:40%}
.mv-person__av img{width:100%;height:100%;max-width:none;object-fit:cover}
a.mv-person:hover .mv-person__av{border-color:var(--mc-accent)}
.mv-person h3{margin-top:8px;font-size:12px;line-height:16px;font-weight:500;color:#fff}
@media (min-width:768px){.mv-person,.mv-person__av{width:100px}.mv-person__av{height:100px}}

.mv-circs{display:flex;gap:8px}
.mv-circs--tight{gap:4px}
.mv-circ{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9999px;background:rgba(54,65,83,.5);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.05);transition:background .15s}
.mv-circ:hover{background:#4a5565}

/* server + tập */
.mv-eps-sec{margin-bottom:16px}
.mv-eps-sec__t span{font-size:18px;line-height:28px;font-weight:700}
.mv-srvnote{width:100%;margin-bottom:12px;padding:8px 0;border:1px dashed var(--mc-orange-400);border-radius:var(--mc-r)}
.mv-srvnote>span{display:flex;align-items:center;gap:8px;margin:8px;font-size:14px;line-height:20px;color:#ffb86a}
.mv-srvnote svg{flex:none}
.mv-srvbar{margin-bottom:16px;border-bottom:1px solid var(--mc-gray-700)}
.mv-servers{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.mv-server{padding:8px 12px;font-size:14px;line-height:20px;font-weight:500;text-align:center;background:var(--mc-gray-800);color:var(--mc-gray-300);transition:background .15s var(--mc-ease)}
.mv-server:hover{background:var(--mc-gray-700)}
.mv-server.is-active{background:var(--mc-green);color:#000}
.mv-eps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.mv-eps[hidden]{display:none}
@media (min-width:640px){.mv-eps{grid-template-columns:repeat(8,minmax(0,1fr))}}
@media (min-width:768px){.mv-eps{grid-template-columns:repeat(10,minmax(0,1fr))}}
@media (min-width:1024px){.mv-eps{grid-template-columns:repeat(12,minmax(0,1fr))}}
.mv-ep{display:flex;align-items:center;justify-content:center;height:32px;border-radius:var(--mc-r);background:var(--mc-gray-800);font-size:14px;line-height:20px;white-space:nowrap;overflow:hidden;transition:background .15s var(--mc-ease)}
.mv-ep:hover{background:var(--mc-gray-700)}

/* bình luận */
.mv-cmt{width:100%;margin-top:16px;padding:16px 0;border-top:1px solid var(--mc-line);border-bottom:1px solid var(--mc-line)}
.mv-cmt__head{display:flex;align-items:center;gap:8px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--mc-line)}
.mv-cmt__head h3{font-size:18px;line-height:28px;font-weight:700;color:#fff}
.mv-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:2px 8px;border-radius:9999px;background:rgba(255,126,8,.15);color:#ff7e08;font-size:12px;line-height:16px;font-weight:600}
.mv-cmt__form{width:100%;margin:16px 0}
.mv-cmt__row{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.mv-cmt__av{display:none}
@media (min-width:640px){
  .mv-cmt__row{flex-direction:row}
  .mv-cmt__av{display:flex;flex:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:9999px;background:var(--mc-gray-800);color:var(--mc-gray-400)}
}
.mv-cmt__main{width:100%;flex:1;min-width:0}
.mv-cmt__main>*+*{margin-top:12px}
/* textarea giữ inline-block như mẫu (dòng chứa thêm ~6px) */
.mv-cmt textarea{width:100%;resize:none;padding:10px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);font-size:16px;line-height:24px;color:#f3f4f6}
.mv-cmt textarea::placeholder{color:var(--mc-gray-400)}
@media (min-width:640px){.mv-cmt textarea{font-size:14px;line-height:20px}}
.mv-cmt__act{display:flex;justify-content:flex-end}
.mv-cmt__btn{cursor:pointer;padding:8px 16px;border-radius:9999px;background:#ff7e08;color:#000;font-size:14px;line-height:20px;font-weight:600;transition:background .15s}
.mv-cmt__btn:hover{background:#ff9a3d}
.mv-cmt__empty{margin-top:24px}
.mv-cmt__empty-box{padding:32px 0;border:1px dashed var(--mc-line);border-radius:var(--mc-r-xl);text-align:center;font-size:14px;line-height:20px;color:var(--mc-gray-400)}

/* nội dung */
.mv-tabs{display:flex;flex-direction:column;gap:8px;margin-top:32px}
.mv-tablist{display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;height:36px;margin-bottom:16px;padding:3px;border-radius:8px;border-bottom:1px solid var(--mc-gray-700);background:var(--mc-gray-800);color:var(--mc-muted)}
.mv-tab{display:inline-flex;flex:1;align-items:center;justify-content:center;gap:6px;height:calc(100% - 1px);padding:4px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.045);box-shadow:0 1px 3px rgba(0,0,0,.1);color:#fff;font-size:14px;line-height:20px;font-weight:500;white-space:nowrap}
.mv-content-t{margin-bottom:8px;font-size:16px;line-height:24px;font-weight:400}
.mv-prose{font-size:16px;line-height:28px;color:var(--mc-gray-300)}
.mv-prose p{margin:20px 0}
.mv-prose>:first-child{margin-top:0}
.mv-prose>:last-child{margin-bottom:0}
.mv-prose a{color:#fff;font-weight:500;text-decoration:underline}
.mv-prose strong,.mv-prose b{color:#fff;font-weight:600}
.mv-prose ul,.mv-prose ol{margin:20px 0;padding-left:26px;list-style:disc}
.mv-tags{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0;padding-top:16px;border-top:1px solid var(--mc-line)}
.mv-tags__l{margin-bottom:8px;font-size:18px;line-height:28px;font-weight:700}
.mv-tags__list{display:flex;flex-wrap:wrap;gap:8px}
.mv-tag{padding:4px 8px;border-radius:9999px;background:var(--mc-gray-800);font-size:14px;line-height:20px;font-weight:400;transition:background .2s}
.mv-tags__list a:hover .mv-tag{background:var(--mc-gray-700)}

/* có thể bạn cũng thích */
.mv-rel{margin-top:48px}
.mv-rel__in{margin-bottom:24px}
.mv-rel__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.mv-related{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;scrollbar-width:none}
.mv-related::-webkit-scrollbar{display:none}
.mv-related .mc-card-a{scroll-snap-align:start}

/* trailer */
.mv-trailer{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.85)}
.mv-trailer[hidden]{display:none}
.mv-trailer__in{width:100%;max-width:960px}
.mv-trailer__close{display:flex;margin:0 0 8px auto}
.mv-trailer__video{aspect-ratio:16/9;overflow:hidden;border-radius:var(--mc-r-lg);background:#000}
.mv-trailer__video iframe{width:100%;height:100%;border:0}

/* ===== Theo dõi phim (nút .mv-follow ở trang chi tiết + lưới /phim-theo-doi) ===== */
/* Nút cùng chiều cao 36px với .mv-trailer-btn / .mv-watch a để hàng .mv-actions không lệch. */
.mv-follow{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:8px 12px;border-radius:8px;background:var(--mc-gray-800);color:var(--mc-gray-200);font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;transition:background .15s var(--mc-ease),color .15s var(--mc-ease),opacity .15s}
.mv-follow:hover{background:var(--mc-gray-700)}
.mv-follow__ico{fill:none;transition:fill .15s var(--mc-ease)}
.mv-follow[disabled]{opacity:.6;cursor:default}
/* Đang theo dõi: cam như nút "Xem Phim", trái tim được tô đầy. */
.mv-follow.is-on{background:var(--mc-accent);color:#fff;font-weight:600}
.mv-follow.is-on:hover{background:rgba(255,126,8,.9)}
.mv-follow.is-on .mv-follow__ico{fill:currentColor}

/* Lưới phim theo dõi: nút X góc trên phải của từng card, hiện rõ khi hover/focus. */
.bm-cell{position:relative}
.bm-del{position:absolute;top:8px;right:8px;z-index:2;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:9999px;background:rgba(16,24,40,.8);color:#fff;opacity:0;transition:opacity .15s var(--mc-ease),background .15s var(--mc-ease)}
.bm-del:hover{background:var(--mc-accent)}
.bm-del:focus-visible,.bm-cell:hover .bm-del,.bm-cell:focus-within .bm-del{opacity:1}
/* Màn cảm ứng không có hover nên luôn hiện nút. */
@media (hover:none){.bm-del{opacity:1}}
.bm-empty{text-align:center;color:var(--mc-gray-300)}
.bm-empty a{color:var(--mc-accent);text-decoration:underline}
