/* ===== Archive layout ===== */
.archive-main{width:100%}
.archive-header{margin-bottom:20px}
.archive-title{font-weight:900;font-size:1.6rem;margin:.2rem 0 .5rem;background:linear-gradient(90deg,#ff4e50,#4b0efb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-transform:uppercase}

/* ===== Generic grids / cards ===== */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}
.card,.anime-card,.series-item{background:var(--base-2);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.card-link{display:block;color:inherit;text-decoration:none}
.card-media,.anime-thumb{position:relative;aspect-ratio:16/9;background:var(--base-3);overflow:hidden}
.card-media img,.anime-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.anime-thumb img{transition:opacity .3s}

/* ===== Badges (shared) ===== */
.badge{position:absolute;z-index:2;padding:2px 8px;border-radius:4px;font-size:12px;color:#fff}
.badge-ep{top:8px;right:8px;background:#2980b9}
.badge-year{bottom:8px;left:8px;background:#8e44ad}
.badge-score{bottom:8px;right:8px;background:#f39c12;color:#000}
.badge-status{top:18px;left:-30px;transform:rotate(-45deg);background:#27ae60}

/* ===== Card content ===== */
.card-title{font-size:16px;margin:10px;line-height:1.3;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--text);font-weight:600}
.card-meta{margin:0 10px 10px;color:var(--muted)}
.card-meta.small{font-size:.85rem}
.archive-pagination{text-align:center;margin-top:26px}

/* ===== Anime list (search/archive) ===== */
.anime-list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:20px}
.anime-card{transition:transform .3s;position:relative}
.anime-card:hover{transform:translateY(-4px)}
.anime-thumb-link{display:block;color:inherit}
a.anime-thumb-link{text-decoration:none}

/* Top-left ribbon */
.badge-top-left{font-weight:700;position:absolute;top:18px;left:-30px;color:#fff;padding:0 30px;font-size:12px;border-radius:4px;transform:rotate(-45deg);text-align:center;box-shadow:0 2px 5px rgba(0,0,0,.2);z-index:2}
.badge-top-left.completed{background:#dc3545}
.badge-top-left.ongoing{background:#28a745}

/* Bottom meta overlay */
.badge-bottom-meta{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);color:#fff;font-size:13px;padding:4px 10px;display:flex;justify-content:space-between;align-items:center;border-bottom-left-radius:10px;border-bottom-right-radius:10px}
.badge-bottom-meta .year{font-weight:500;background:#8e44ad;color:#fff;padding:2px 6px;font-size:12px;border-radius:4px}
.badge-bottom-meta .score{font-weight:700;color:#ffc107}
.badge-bottom-meta .star{color:#ffc107}

/* Top-right badge */
.badge-top-right{position:absolute;top:8px;right:8px;font-size:12px;font-weight:700;padding:3px 7px;border-radius:4px;background:rgb(21 29 137);color:#fff}

/* Anime title */
.anime-title{font-size:15px;font-weight:600;padding:5px;text-align:center;color:var(--text);line-height:1.4em;max-height:55px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* ===== Completed series (reuse) ===== */
.series-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px;margin:10px}
.series-item:hover{transform:translateY(-5px)}
.series-thumb,.series-thumb img{display:block;border-radius:10px;width:100%;aspect-ratio:3/4;object-fit:cover;position:relative;overflow:hidden}
.status-badge{position:absolute;top:18px;left:-30px;background:#e53935;color:#fff;font-size:12px;font-weight:700;padding:4px 30px;transform:rotate(-45deg);text-align:center;box-shadow:0 2px 5px rgba(0,0,0,.2);z-index:2}
.ep-badge,.year-badge,.score-badge{position:absolute;font-size:12px;padding:2px 6px;border-radius:4px;font-weight:700;z-index:2}
.series-item .ep-badge{top:8px;right:8px;background:linear-gradient(39deg,#fecf59,#fff1cc);color:#0b1bf9}
.year-badge{bottom:8px;left:8px;background:color-mix(in srgb,#fff 85%,var(--bg) 15%);color:var(--text)}
.score-badge{bottom:8px;right:8px;background:rgba(255,215,0,.9);color:#000}
.series-title{margin:10px;font-size:14px;font-weight:600;text-align:center;line-height:1.4;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;height:2.8em}
.series-title a{text-decoration:none;color:inherit}
.series-title a:hover{color:color-mix(in srgb,var(--brand) 85%,#000 15%)}
@media (max-width:440px){.series-list{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}
@media (max-width:380px){.series-list{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}}

/* ===== Pagination ===== */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:30px;flex-wrap:wrap}
.pagination .page-numbers{display:inline-block;padding:8px 14px;font-size:14px;font-weight:600;color:var(--text);background:var(--base-3);border-radius:6px;text-decoration:none;transition:.2s;border:1px solid var(--line)}
.pagination .page-numbers:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
.pagination .current{background:var(--brand);color:#fff;border-color:var(--brand);cursor:default}

/* =========================================================
   Archive Pagination (for archive.php template)
   Works for:
   - <nav class="archive-pagination ..."> ... paginate_links() ...
   - Theme outputs .navigation.pagination .nav-links
========================================================= */

/* Variables (optional). If site already defines these, remove block below. */
:root{
  --pagi-bg: rgba(255,255,255,.8);
  --pagi-bd: rgba(0,0,0,.08);
  --pagi-shadow: 0 10px 24px rgba(0,0,0,.08);
  --pagi-fg: #111827;
  --pagi-muted: rgba(17,24,39,.55);
  --pagi-accent: #0ea5e9;
  --pagi-on-accent: #ffffff;
}

/* 1) Base container: your template uses <nav class="archive-pagination ..."> */
.archive-pagination{
  display: flex;
  justify-content: center;
  margin: 28px 0 18px;
}

/* 2) If theme uses .navigation.pagination, keep compatibility */
.navigation.pagination{
  display:flex;
  justify-content:center;
  margin: 28px 0 18px;
}

/* 3) The wrapper area:
   - With nav-links (core pagination)
   - Or without, when paginate_links outputs anchors directly
*/
.archive-pagination,
.navigation.pagination{
  max-width: 100%;
}

/* When nav-links exist */
.archive-pagination .nav-links,
.navigation.pagination .nav-links{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px;
  background: var(--pagi-bg);
  border: 1px solid var(--pagi-bd);
  border-radius: 12px;
  box-shadow: var(--pagi-shadow);
  color: var(--pagi-fg);
  max-width: 100%;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.archive-pagination .nav-links::-webkit-scrollbar,
.navigation.pagination .nav-links::-webkit-scrollbar{ display:none; }

/* If there is NO nav-links wrapper, style the nav itself like the wrapper */
.archive-pagination:not(:has(.nav-links)){
  padding: 6px;
  background: var(--pagi-bg);
  border: 1px solid var(--pagi-bd);
  border-radius: 12px;
  box-shadow: var(--pagi-shadow);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.archive-pagination:not(:has(.nav-links))::-webkit-scrollbar{ display:none; }

/* 4) Page numbers (anchors/spans) */
.archive-pagination .page-numbers,
.navigation.pagination .page-numbers{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  min-width: 40px;
  padding: 0 12px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
  line-height: 1;
  color: var(--pagi-fg);
  border: 1px solid transparent;
  transition: transform .12s ease, background-color .12s ease, color .12s ease, border-color .12s ease;
  white-space: nowrap;
}

/* Current page */
.archive-pagination .page-numbers.current,
.navigation.pagination .page-numbers.current{
  background: var(--pagi-accent);
  color: var(--pagi-on-accent);
  border-color: transparent;
  box-shadow: 0 6px 14px rgba(14,165,233,.25);
}

/* Dots */
.archive-pagination .page-numbers.dots,
.navigation.pagination .page-numbers.dots{
  min-width: auto;
  padding: 0 6px;
  color: var(--pagi-muted);
  pointer-events: none;
}

/* Hover for non-current non-dots */
.archive-pagination a.page-numbers:not(.current):not(.dots):hover,
.navigation.pagination a.page-numbers:not(.current):not(.dots):hover{
  background: color-mix(in oklab, var(--pagi-accent) 14%, var(--pagi-bg));
  border-color: color-mix(in oklab, var(--pagi-accent) 40%, var(--pagi-bg));
}

/* Active */
.archive-pagination .page-numbers:active,
.navigation.pagination .page-numbers:active{
  transform: translateY(1px);
}

/* Prev/Next */
.archive-pagination .prev.page-numbers,
.archive-pagination .next.page-numbers,
.navigation.pagination .prev.page-numbers,
.navigation.pagination .next.page-numbers{
  font-weight: 700;
}

/* Mobile */
@media (max-width:480px){
  .archive-pagination .page-numbers,
  .navigation.pagination .page-numbers{
    height: 36px;
    min-width: 36px;
    padding: 0 10px;
    border-radius: 9px;
  }
}