/* IDY Template - Base CSS (non-class-dependent, safe for class-prefix mode) */
/* CSS Variables - defined on :root for all pages */
:root {
  --primary: #6366f1;
  --primary-hover: #4f46e5;
  --primary-rgb: 99,102,241;
  --bg: #09090f;
  --bg-2: #111122;
  --bg-card: #14142a;
  --bg-hover: #1c1c38;
  --text: #e2e2f0;
  --text-muted: #7878a0;
  --border: rgba(255,255,255,0.07);
  --red: #ef4444;
  --gold: #f59e0b;
  --green: #22c55e;
  --secondary: #8b5cf6;
  --radius: 10px;
  --radius-sm: 6px;
  --shadow: 0 4px 20px rgba(0,0,0,0.4);
  --transition: 0.2s ease;
}

/* Reset */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.6;min-height:100vh}
a{color:inherit;text-decoration:none}
a:hover{color:var(--primary)}
img{max-width:100%;display:block;border-radius:var(--radius-sm)}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font:inherit}
input,select,textarea{font:inherit}

/* Typography */
h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.3}
p{line-height:1.7}

/* Layout */
[class~="container"]{max-width:1300px;margin:0 auto;padding:0 20px}
[class~="section"]{padding:40px 0}

/* Skip link (accessibility) */
[class~="skip-link"]{position:absolute;top:-100px;left:10px;background:var(--primary);color:#fff;padding:8px 16px;border-radius:4px;z-index:9999;transition:top 0.2s}
[class~="skip-link"]:focus{top:10px}

/* Scrollbar */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg-2)}
::-webkit-scrollbar-thumb{background:var(--primary);border-radius:3px}

/* Selection */
::selection{background:rgba(var(--primary-rgb),0.3);color:#fff}

/* ===== MOVIE GRID & CARD SYSTEM =====
 * generateMovie2Card() outputs:
 * <ul class="pic-list">
 *   <li class="col-lg-6 ...">
 *     <a class="pic-img" href="...">
 *       <img class="lazyload" src="..." ...>
 *       <span class="score">9.0</span>
 *       <span class="tips">HD</span>
 *       <span class="hits">🔥2.3万</span>
 *       <span class="title text-overflow">名称</span>
 *     </a>
 *     <h3 class="name text-overflow"><a>名称</a></h3>
 *     <div class="card-meta">...</div>
 *   </li>
 * </ul>
 * Use [class*=""] attribute selectors for class-prefix mode compatibility
 */

/* Movie grid container */
[class~="movie-grid"]{display:block}

/* ul[class~="pic-list"]: transparent to parent layout */
[class*="pic-list"]{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:16px}

/* li items */
[class*="pic-list"] li{list-style:none;margin:0;padding:0}

/* Card wrapper: the <a class="pic-img"> */
[class*="pic-img"]{display:block;position:relative;border-radius:10px;overflow:hidden;background:var(--bg-card);transition:transform 0.2s,box-shadow 0.2s;text-decoration:none;color:inherit}
[class*="pic-img"]:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,0.5)}

/* Poster image */
[class*="pic-img"] img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;transition:transform 0.3s;border-radius:0}
[class*="pic-img"]:hover img{transform:scale(1.04)}

/* Score badge */
[class*="pic-img"] [class*="score"]{position:absolute;top:6px;right:6px;background:rgba(0,0,0,0.75);color:#f59e0b;font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px;z-index:2;line-height:1.4}

/* Tips badge (HD/全集 etc.) */
[class*="pic-img"] [class*="tips"]{position:absolute;top:6px;left:6px;background:rgba(99,102,241,0.9);color:#fff;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;z-index:2;line-height:1.4}

/* Hits badge */
[class*="pic-img"] [class*="hits"]{position:absolute;bottom:30px;left:6px;background:rgba(0,0,0,0.6);color:#fff;font-size:10px;padding:2px 5px;border-radius:3px;z-index:2;line-height:1.4}

/* Title overlay */
[class*="pic-img"] [class*="title"]{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,0.9) 0%,transparent 100%);color:#fff;font-size:12px;font-weight:600;padding:20px 8px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Name below card */
[class*="pic-list"] [class*="name"]{font-size:12px;font-weight:600;margin:6px 0 2px;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}
[class*="pic-list"] [class*="name"] a{color:var(--text);text-decoration:none}
[class*="pic-list"] [class*="name"] a:hover{color:var(--primary)}

/* Card meta */
[class*="card-meta"]{font-size:11px;color:var(--text-muted);display:flex;gap:6px;overflow:hidden}
[class*="vod-class"],[class*="vod-date"]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}

/* text-overflow util */
[class*="text-overflow"]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Responsive grid breakpoints */
@media(max-width:1400px){[class*="pic-list"]{grid-template-columns:repeat(5,1fr)}}
@media(max-width:1100px){[class*="pic-list"]{grid-template-columns:repeat(4,1fr)}}
@media(max-width:800px){[class*="pic-list"]{grid-template-columns:repeat(3,1fr);gap:10px}}
@media(max-width:520px){[class*="pic-list"]{grid-template-columns:repeat(2,1fr);gap:8px}}

/* Rank list (text format output from {本周热播榜} etc.) */
[class*="rank-list"],[class*="top-list"]{display:flex;flex-direction:column;gap:8px;list-style:none;padding:0;margin:0}
[class*="rank-list"] li,[class*="top-list"] li{display:flex;align-items:center;gap:8px;font-size:13px}
[class*="rank-list"] a,[class*="top-list"] a{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;transition:color 0.2s}
[class*="rank-list"] a:hover,[class*="top-list"] a:hover{color:var(--primary)}

/* Pagination */
[class*="pagination"]{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;list-style:none;padding:0;margin:20px 0}
[class*="pagination"] a,[class*="pagination"] span{display:flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;border-radius:6px;font-size:13px;background:var(--bg-2);border:1px solid var(--border);color:var(--text-muted);transition:all 0.2s;text-decoration:none}
[class*="pagination"] a:hover{background:rgba(99,102,241,0.15);border-color:rgba(99,102,241,0.4);color:var(--primary)}
[class*="pagination"] [class*="active"] a,[class*="pagination"] [class*="current"]{background:var(--primary);border-color:var(--primary);color:#fff}

/* Utility */
[class~="sr-only"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[class~="text-center"]{text-align:center}
[class~="text-muted"]{color:var(--text-muted)}
[class~="badge-hot"]{background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:0.5px}
[class~="badge-new"]{background:var(--green);color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px}
[class~="badge-hd"]{background:var(--gold);color:#000;font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px}

/* site-slogan: 随机口号展示栏 */
[class~="site-slogan"] {
    text-align: center;
    padding: 6px 16px;
    font-size: 13px;
    opacity: 0.65;
    background: transparent;
    pointer-events: none;
}
[class~="site-slogan"] p {
    margin: 0;
    line-height: 1.4;
}


/* Hide mobile menu toggle on desktop */
@media (min-width: 769px) { [class~="menu-toggle"] { display: none !important; } }

/* Logo text fallback */
[class~="logo-text"] {
    font-size: 1.5rem;
    font-weight: 700;
    color: inherit;
    text-decoration: none;
    display: inline-block;
}

/* ===== Detail Page Styles (added v-next) ===== */
[class~="detail-main"] { padding: 20px 0; }
[class~="detail-container"] { display: flex; gap: 30px; max-width: 1200px; margin: 0 auto; padding: 0 15px; flex-wrap: wrap; }
[class~="detail-poster"] { flex-shrink: 0; width: 200px; }
[class~="detail-poster"] img { width: 100%; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
[class~="detail-info"] { flex: 1; min-width: 0; }
[class~="detail-title"] { font-size: 1.8rem; font-weight: bold; margin-bottom: 16px; }
[class~="detail-meta"] { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 16px; font-size: 0.95rem; }
[class~="meta-item"] { display: inline-block; }
[class~="detail-synopsis"] { margin-bottom: 20px; line-height: 1.8; }
[class~="detail-synopsis"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 8px; }
[class~="detail-play-btn"] { margin: 20px 0; }
[class~="btn-play-now"] { display: inline-block; padding: 12px 32px; background: #e53935; color: #fff !important; border-radius: 4px; text-decoration: none; font-size: 16px; font-weight: bold; transition: background 0.2s; }
[class~="btn-play-now"]:hover { background: #c62828; }
[class~="detail-episodes"] { max-width: 1200px; margin: 24px auto; padding: 0 15px; }
[class~="detail-episodes"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 12px; }
[class~="detail-related"] { max-width: 1200px; margin: 24px auto; padding: 0 15px; }
[class~="detail-related"] h3 { font-size: 1.1rem; font-weight: bold; margin-bottom: 12px; }
[class~="breadcrumb"] { max-width: 1200px; margin: 12px auto; padding: 0 15px; font-size: 13px; color: #888; }
[class~="breadcrumb"] a { color: #666; text-decoration: none; }
[class~="breadcrumb"] a:hover { text-decoration: underline; }
@media (max-width: 768px) {
    [class~="detail-container"] { flex-direction: column; }
    [class~="detail-poster"] { width: 140px; margin: 0 auto; }
    [class~="detail-title"] { font-size: 1.4rem; }
    [class~="btn-play-now"] { width: 100%; text-align: center; box-sizing: border-box; }
}