/*
Theme Name: PhimHub v6
Theme URI: http://localhost/phimhub
Author: ChatGPT
Description: PhimHub v6 - dark gray movie-style theme (9 per page, search, pagination, like by IP, comments under video)
Version: 6.0
Text Domain: phimhub
*/

:root{
  --bg:#0f1113;
  --card:#181a1c;
  --muted:#9aa4ad;
  --accent:#ff3d3d;
  --text:#e6eef3;
}

*{box-sizing:border-box}
body{margin:0;font-family:Inter, Arial, Helvetica, sans-serif;background:var(--bg);color:var(--text);line-height:1.4;}
a{color:var(--accent);text-decoration:none;}
.container{width:1100px;max-width:95%;margin:0 auto;padding:18px;}
.site-header{display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid rgba(255,255,255,0.03);}
.site-title{font-size:20px;margin:0;color:var(--text);}
.search-wrap{min-width:320px;}
.search-wrap input[type="search"]{width:100%;padding:8px 10px;border-radius:6px;border:1px solid rgba(255,255,255,0.04);background:#0b0c0d;color:var(--text);}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:18px;}
.card{background:var(--card);border-radius:8px;overflow:hidden;position:relative;box-shadow:0 6px 18px rgba(0,0,0,0.6);transition:transform .15s;}
.card:hover{transform:translateY(-6px);}
.card .thumb{display:block;width:100%;height:190px;object-fit:cover;background:#0b0c0d;}
.play-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.45);backdrop-filter:blur(2px);opacity:0;transition:opacity .15s;}
.card:hover .play-overlay{opacity:1;}
.play-overlay .icon{font-size:22px;color:#fff;}
.card-info{padding:12px;text-align:center;}
.card-info h3{margin:6px 0;font-size:15px;color:var(--text);height:38px;overflow:hidden;}
.meta{display:flex;justify-content:center;gap:12px;color:var(--muted);font-size:13px;margin-top:8px;}
.meta span{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,0.02);padding:6px 8px;border-radius:14px;cursor:default;}
.like-btn{cursor:pointer;}
.like-btn.liked{background:rgba(255,61,61,0.12);border:1px solid rgba(255,61,61,0.18);}
.pagination{display:flex;justify-content:center;gap:6px;margin:28px 0;}
.page-numbers{padding:8px 10px;border-radius:6px;background:transparent;color:var(--text);text-decoration:none;border:1px solid rgba(255,255,255,0.03);}
.page-numbers.current{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:700;}
.no-results{padding:30px;text-align:center;color:var(--muted);}
.comment-list{margin-top:18px;background:var(--card);padding:12px;border-radius:8px;}
.comment-item{border-bottom:1px solid rgba(255,255,255,0.03);padding:8px 6px;}
.comment-author{font-weight:700;color:var(--text);font-size:14px;}
.comment-content{color:var(--muted);font-size:14px;margin-top:6px;}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.grid{grid-template-columns:1fr;} .search-wrap{min-width:unset;} .site-header{flex-direction:column;gap:12px;align-items:flex-start}}
/* ========== VIDEO THUMBNAIL & PLAYER ========== */
.video-wrapper {
  position: relative;
}
.video-wrapper .play-overlay {
  transition: 0.25s ease;
}
.video-wrapper:hover .play-overlay {
  transform: translate(-50%, -50%) scale(1.2);
  opacity: 0.9;
}
.video-wrapper video {
  display: block;
  width: 100%;
  border-radius: 6px;
}