body,html{background-color:#02080f}
#header{background:#333333}
:root{--primary-text:#da966e}
/* image */
.thumb-m{overflow:hidden;display:block;width:100%;height:0;padding-bottom:160%;position:relative}
.img-m{position:absolute;top:0;left:0;right:0;bottom:0;object-fit:cover;width:100%!important;min-height:100%!important}
.image-movie {width:100%;object-fit:cover;margin:1.2rem auto}
.main-menu{background:#2d2d2d}
.main-menu .menu-item.active > a,.main-menu .menu-item a:hover{color:#c58560}
.title-box .tophot,.right-content .block .caption{color:var(--primary-text)}
.main-menu .menu-item .sub-menu{background-color:#2d2d2d}
.list-films .item .icon-play,.list-films .label-quality{background:#522e75}
.list-films .label-quality:after{border-left:10px solid #522e75}
#film_hot .item .label,#film_related .item .label,.film-new .item .label{background:#a3765d;border-bottom:2px solid #96674f}
.list-films.film-new .item .name{background:#181818}
.list-film li:nth-child(even){background:rgb(24 24 24)}
.title-box .tab.active,.title-box .tab:hover{color:var(--primary-text);border-bottom:2px solid #907863}
.most-view .list-film .item .number-rank{background:#c58560}
.breadcrumbs{background:#181818}
#page-info .blockbody .title{color:#ff9658}
.btn-download-link{}
.btn-stream-link{}
.dinfo .film-status{}
#player-video .details .name h1 a,#player-video .details .name span{color:var(--primary-text)}
.film-note{border:1px solid #e8a568;background:#181818}
#player-video .bottom-content{background:#181818}
.mp-tips{color:#fff}
#suggestions ul.autocomplete-list li span,#suggestions ul.autocomplete-list li strong,#suggestions ul.autocomplete-list li.last a{color:var(--primary-text)}
.most-view .list-film .item a:hover,.list-film .film-item-ver .name a:hover{color:var(--primary-text)}
.most-view .tabs .tab:hover{background:#333}
#footer{color:#848484;background:#2d2d2d}
#footer .info{background:#353535}
.pagination ul li a{display:block;padding:6px 8px;min-width:36px;text-align:center;background-color:#444;font-size:14px}
@media (min-width:250px) and (max-width:979px){
  #header .logo{display:block;text-align:center}
  #header .logo img{width:120px;height:30px!important;margin-bottom:0!important}
}
.server-episode-block{font-size:16px;font-weight:700;margin-bottom:10px;color:#da843d}
.row-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.row-g.wide{grid-template-columns:repeat(6,1fr);gap:1rem}
.item-m{display:block;position:relative}
.item-m .name{background-color:#181818;padding:10px;position:absolute;bottom:0;left:0;right:0;text-align:center}
.title-m{font-size:12px;margin-top:0;margin-bottom:.5rem;font-weight:700;color:#fff}
.title-m-og{font-size:12px;margin-top:0;margin-bottom:0;font-weight:600;color:#fff}
.item-m .label{position:absolute;display:inline-block;line-height:1.2em;padding:5px;font-size:11px;color:#fff;background:#A3765D;border-bottom:2px solid #96674f;border-radius:0 5px 5px 0;box-shadow:2px 2px 3px 0 rgba(0,0,0,0.75);z-index:4;word-break:break-all;white-space:normal}
.icon-play{background:url('../images/play-button.svg');position:absolute;top:0;left:0;z-index:5;width:100%;height:100%;background-color:rgba(0,0,0,0.7);background-size:2.5rem 2.5rem;background-position:center center;background-repeat:no-repeat;-webkit-transition:all ease-out 0.35s;transition:all ease-out 0.35s;opacity:0}
.thumb-m:hover .icon-play{opacity:1}
.split-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;white-space:normal!important}
/* Movie Info */
#page-info .blockbody .poster{float:unset;width:unset;margin:unset;position:relative}
#page-info .blockbody{padding:unset;background:none}
.blockbody .box-info{background:#181818;padding:10px}
.blockbody .box-info .poster .thumb-m{border-radius:.5rem;overflow:hidden}
.blockbody .box-info .poster .btn-watch{background-color:red;color:#fff;text-transform:uppercase;font-weight:600;padding:.5rem;position:absolute;z-index:2;bottom:0;left:0;right:0;border-radius:0;box-shadow:none!important;border:none!important;font-size:13px;text-align:center}
.blockbody .box-info .box-content .wrapper{width:100%;margin:0 1% 0 0;padding:5px 8px;line-height:26px;font-size:12px;color:#bbb;background:#222}
.blockbody .box-info .box-content .wrapper .name{font-weight:600;color:#ddd}
.blockbody .box-info .box-content .wrapper .line-item  a{color:#fff}
.blockbody .box-info .box-content .wrapper .line-item  a:hover{color:var(--primary-text)}
.blockbody .box-content__header .heading{font-size:18px!important;color:var(--primary-text);margin-top:0}
/* Movie Watch */
.tip-change-server{margin:1rem auto;border:1px dashed var(--primary-text);padding:5px;display:flex;flex-direction:column;row-gap:1rem;align-items:center;background:transparent}
.tip-change-server .sever-note{color:var(--primary-text)}
.box-episodes{display:flex;flex-direction:column;gap:.75rem}
.box-episode__header{display:flex;gap:1.5rem;align-items:center;padding-bottom:8px;border-bottom:2px dashed #5d5d5d;margin-bottom:8px}
.box-episode__header .heading{font-size:1.5rem;color:var(--primary-text)}
.episodes-tab{display:flex;gap:10px}
.episodes-tab .heading{font-size:1.5rem;color:var(--primary-text)}
.tab-version{color:#666;border:1px solid transparent;padding:.3rem .8rem;font-size:13px;font-weight:500;border-radius:2rem;transition:background 0.3s;cursor:pointer}
.tab-version.active{color:#f90;border-color:#f90}
.tab-version:hover{color:#f90;border-color:#f90}
.box-episode__bottom{margin-bottom:1.4rem}
.episode-block{display:none}
.episode-block.active{display:block}
.list-episode{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;max-height:300px;overflow-y:auto}
.list-episode a{background-color:#fff;color:#000;font-weight:500;display:block;padding:.4rem;border-radius:6px}
.list-episode a.current{background-color:#dd003f;color:#fff}
.list-episode a:hover{opacity:.9}
.box-content {margin-bottom:2rem}
.box-content__header{padding-bottom:8px;border-bottom:2px dashed #5d5d5d;margin-bottom:.8rem}
.box-content__header .heading{color:var(--primary-text);font-size:1.5rem}
.box-content__header .heading a{font-size:1.5rem;color:var(--primary-text)}
.box-content__header .real-name{font-size:1rem;color:#fff;margin:.8rem 0}
.box-releatd {gap:1rem}
.box-releatd__header .heading {font-size:1.2rem;color:var(--primary-text)}
/* right bar*/
.caption {margin-bottom:1rem}
.caption span {color:var(--primary-text);font-size:1.2rem; padding-bottom:5px;border-bottom:2px solid var(--primary-text);}
.trailer.block{margin-bottom:2rem}
.box-content__bottom .short-description {color:#abb7c4; font-size:1rem;max-height: 200px;overflow: hidden;transition: max-height 0.5s ease;color:#abb7c4}
.box-content__bottom .short-description.expanded {max-height: 10000px;}
.toggle-button{display:block;padding:5px 16px;color:#fff;font-size:14px;border:1px solid var(--primary-text) ;border-radius:4px;cursor:pointer;transition:background-color 0.3s ease;background:#222222; opacity:0.6}
.toggle-button:hover{opacity:0.5; color:var(--primary-text)}
/*========================= Mobile ======================*/
@media (max-width:1131px){
  .row-g.wide{grid-template-columns:repeat(5,1fr)}
}
@media (min-width:481px) and (max-width:768px){
  .row-g{grid-template-columns:repeat(3,1fr)}
  .row-g.wide{grid-template-columns:repeat(4,1fr)}
  .list-episode{grid-template-columns:repeat(6,1fr)}
}
@media (max-width:480px){
  .mobile-hidden{display:none}
  .row-g,.row-g.wide{grid-template-columns:repeat(2,1fr)}
  .list-episode{grid-template-columns:repeat(4,1fr)}
  .tip-change-server .sever-note{font-size:12px}
}
#content{
	padding-bottom: 30px;
}
ul.tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 10px 0;
    padding: 0;
    font-size: 14px;
}
ul.tags .caption {
    font-weight: bold;
    margin-right: 8px;
    display: flex;
    align-items: center;
}
ul.tags .caption span {
    margin-right: 5px;
}
ul.tags .caption i {
    font-size: 12px;
    color: #999;
}
ul.tags .tag-item {
    flex: 1;
}
ul.tags .tag-item div {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
ul.tags .tag-item a {
    display: inline-block;
    padding: 4px 8px;
    background-color: #f2f2f2;
    border-radius: 4px;
    color: black !important;
    text-decoration: none;
    transition: all 0.2s ease;
}
ul.tags .tag-item a:hover {
    background-color: #ff4d4f;
    color: #fff;
}