/*
Theme Name: Anime-ID
Theme URI: https://player360.xyz/
Author: ที่รัก
Author URI: https://player360.xyz/
Description: ธีมดูอนิเมะออนไลน์ รองรับ ACF พร้อม SEO JSON-LD
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: anime-id
*/

:root{
--neon:#00ffff;
--bg-dark:#0a0a0a;
}


/* BODY */

body{
font-family:'Prompt',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
background:radial-gradient(circle at top left,#080808,var(--bg-dark));
color:#fff;
min-height:100vh;
display:flex;
flex-direction:column;
}


/* NEON TEXT */

.neon{
color:var(--neon);
text-shadow:0 0 10px rgba(0,255,255,.5);
}


/* CARD */

.anime-card{
display:block;
background:rgba(255,255,255,.05);
border-radius:14px;
overflow:hidden;
text-decoration:none;
color:#fff;
height:100%;
transition:.3s;
box-shadow:0 0 8px rgba(0,255,255,.2);
}

.anime-card:hover{
transform:translateY(-5px);
box-shadow:0 0 16px rgba(0,255,255,.45);
}


/* POSTER */

.poster-box{
position:relative;
}

.poster-box img{
width:100%;
height:240px;
object-fit:cover;
}


/* BADGES */

.poster-badges{
position:absolute;
top:8px;
left:8px;
display:flex;
flex-direction:column;
gap:5px;
}

.badge-ep{
background:#ff4b6e;
color:#fff;
font-size:12px;
padding:3px 8px;
border-radius:6px;
}

.badge-sound{
background:#00c3ff;
color:#fff;
font-size:12px;
padding:3px 8px;
border-radius:6px;
}


/* FOOTER */

.footer{
margin-top:auto;
padding:1rem;
text-align:center;
background:rgba(255,255,255,.03);
border-top:1px solid rgba(255,255,255,.1);
font-size:.9rem;
color:#9aa0a6;
}


/* SINGLE PAGE */

.anime-single{
margin-top:30px;
}

.anime-box{
background:#000;
padding:30px;
border-radius:15px;
}

.anime-poster{
  width:100%;
  height:300px;
  object-fit:cover;
  border-radius:12px;
}

.anime-title{
font-family:'Orbitron',sans-serif;
color:#0ff;
text-shadow:0 0 10px rgba(0,255,255,.5);
margin-bottom:10px;
}

.anime-desc{
color:#ddd;
line-height:1.8;
}


/* INFO */

.info-row{
display:flex;
justify-content:space-between;
margin-bottom:10px;
}

.label{
color:#ff7c9c;
font-weight:600;
}

.rating{
color:#ffd700;
}


/* SERVER BUTTON */

.server-buttons button{
background:#ff4b6e;
border:none;
padding:8px 14px;
margin-right:6px;
border-radius:6px;
color:#fff;
cursor:pointer;
transition:.2s;
}

.server-buttons button:hover{
background:#ff2c55;
}


/* EPISODE BOX */

.episode-box{
background:#1a1a1a;
padding:20px;
border-radius:10px;
}

.episode-list{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:10px;
}

.episode-list button{
background:#444;
border:none;
color:#fff;
padding:6px 12px;
border-radius:6px;
cursor:pointer;
font-size:14px;
transition:.2s;
}

.episode-list button:hover{
background:#ff4b6e;
}


/* PAGINATION */

.anime-pagination{
margin-top:40px;
display:flex;
justify-content:center;
}

.anime-pagination ul{
display:flex;
gap:10px;
padding:12px 16px;
background:rgba(255,255,255,.05);
border-radius:14px;
box-shadow:0 0 15px rgba(0,255,255,.15);
list-style:none;
}

.anime-pagination a,
.anime-pagination span{
display:flex;
align-items:center;
justify-content:center;
min-width:38px;
height:38px;
padding:0 12px;
border-radius:8px;
text-decoration:none;
font-weight:600;
font-size:14px;
color:var(--neon);
background:rgba(255,255,255,.05);
border:1px solid rgba(0,255,255,.3);
transition:.25s;
}

.anime-pagination a:hover{
background:var(--neon);
color:#000;
box-shadow:0 0 12px var(--neon);
transform:translateY(-2px);
}

.anime-pagination .current{
background:var(--neon);
color:#000;
border:none;
box-shadow:0 0 12px var(--neon);
}