/* ====== maccms.css - MacCMS Specific Styles ====== */

/* Detail page */
.detail-wrap {
    max-width: var(--container-max);
    margin:0 auto; padding:24px 20px;
}
.detail-header {
    display:flex; gap:24px; margin-bottom:24px;
}
.detail-poster {
    flex-shrink:0; width:220px;
    border-radius: var(--radius-md);
    overflow:hidden; position:relative;
    background: var(--bg-card);
}
.detail-poster img { width:100%; display:block; }
.detail-poster .poster-play-overlay { opacity:0; }
.detail-poster:hover .poster-play-overlay { opacity:1; }
.detail-info { flex:1; min-width:0; }
.detail-title { font-size:24px; font-weight:700; margin-bottom:8px; }
.detail-meta { font-size:13px; color:var(--text-secondary); margin-bottom:6px; }
.detail-meta span { margin-right:16px; }
.detail-score {
    display:inline-flex; align-items:center; gap:4px;
    font-size:18px; font-weight:700; color:var(--accent-gold);
    margin-bottom:12px;
}
.detail-desc {
    font-size:13px; color:var(--text-secondary); line-height:1.7;
    margin-bottom:16px;
}
.detail-actions { display:flex; gap:10px; flex-wrap:wrap; }
.detail-btn {
    padding:10px 24px;
    border-radius: var(--radius-full);
    font-size:14px; font-weight:600;
    display:inline-flex; align-items:center; gap:6px;
}
.detail-btn-primary { background:var(--accent-red); color:#fff; }
.detail-btn-primary:hover { background:#ff5a6a; color:#fff; }
.detail-btn-secondary { background:rgba(255,255,255,0.1); color:#fff; }
.detail-btn-secondary:hover { background:rgba(255,255,255,0.15); }

/* Play list */
.play-list-wrap { margin-bottom:24px; }
.play-list-title { font-size:16px; font-weight:600; margin-bottom:12px; }
.play-list {
    display:flex; flex-wrap:wrap; gap:8px;
}
.play-list a {
    padding:8px 16px;
    background: var(--bg-card);
    border-radius: var(--radius-sm);
    font-size:13px; color:var(--text-secondary);
    transition: var(--transition);
}
.play-list a:hover, .play-list a.active {
    background:var(--accent-red); color:#fff;
}

/* Player page */
.player-wrap {
    max-width: var(--container-max);
    margin:0 auto; padding:0 20px;
}
.player-box {
    position:relative;
    aspect-ratio:16/9;
    background:#000;
    border-radius: var(--radius-md);
    overflow:hidden;
    margin-bottom:16px;
}
.player-box iframe { width:100%; height:100%; border:none; }

/* Search page */
.search-wrap {
    max-width: var(--container-max);
    margin:0 auto; padding:24px 20px;
}
.search-title { font-size:18px; font-weight:600; margin-bottom:20px; }
.search-grid {
    display:grid;
    grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
    gap:16px;
}

/* Show/List page */
.show-wrap {
    max-width: var(--container-max);
    margin:0 auto; padding:24px 20px;
}
.show-title { font-size:18px; font-weight:600; margin-bottom:20px; }

/* Filter module */
.mac-filter {
    display:flex; flex-wrap:wrap; gap:8px;
    margin-bottom:20px; padding:16px;
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}
.mac-filter a {
    padding:6px 14px;
    border-radius: var(--radius-full);
    font-size:13px; color:var(--text-secondary);
    background:rgba(255,255,255,0.05);
}
.mac-filter a:hover, .mac-filter a.active {
    background:var(--accent-red); color:#fff;
}

/* Paging */
.mac-paging {
    display:flex; justify-content:center; gap:6px;
    margin-top:24px; padding:16px 0;
}
.mac-paging a, .mac-paging span {
    padding:8px 14px;
    border-radius: var(--radius-sm);
    font-size:13px;
    background: var(--bg-card);
    color: var(--text-secondary);
}
.mac-paging a:hover { background:var(--bg-card-hover); color:#fff; }
.mac-paging span.current {
    background:var(--accent-red); color:#fff;
}

/* Mobile detail */
@media (max-width:768px) {
    .detail-header { flex-direction:column; align-items:center; text-align:center; }
    .detail-poster { width:160px; }
    .detail-actions { justify-content:center; }
    .detail-title { font-size:20px; }
}