/*
Theme Name: RP Starter
Theme URI: https://rpstarter.com
Author: RP Starter
Description: A clean, beginner-friendly WordPress block theme for AI roleplay guides, presets, character cards, AI models, extensions, and troubleshooting.
Version: 1.0.2
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: rpstarter
*/

:root {
  --rp-radius-sm: 12px;
  --rp-radius-md: 18px;
  --rp-radius-lg: 28px;
  --rp-shadow-sm: 0 6px 18px rgba(19, 42, 82, .07);
  --rp-shadow-md: 0 16px 42px rgba(19, 42, 82, .10);
  --rp-border: #e5eaf3;
  --rp-muted: #66758f;
}

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; }
a { text-underline-offset: 3px; }

/* Header */
.rp-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(14px);
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(229,234,243,.9);
}
.admin-bar .rp-site-header { top: 32px; }
.rp-site-header .wp-block-site-title a { text-decoration: none; }
.rp-site-header .wp-block-navigation-item__content { text-decoration: none; }
.rp-site-header .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--primary); }

/* Hero */
.rp-hero {
  overflow: hidden;
  border: 1px solid var(--rp-border);
  border-radius: var(--rp-radius-lg);
  box-shadow: var(--rp-shadow-md);
  background:
    radial-gradient(circle at 82% 18%, rgba(129,92,255,.19), transparent 29%),
    radial-gradient(circle at 70% 75%, rgba(71,168,255,.17), transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f8f9ff 52%,#eef4ff 100%);
}
.rp-hero-visual {
  min-height: 310px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 65% 25%, rgba(244,87,180,.20), transparent 25%),
    radial-gradient(circle at 35% 58%, rgba(54,92,255,.22), transparent 32%),
    linear-gradient(145deg,#f7efff,#eef7ff);
  position: relative;
  overflow: hidden;
}
.rp-hero-visual:before,
.rp-hero-visual:after {
  content: "";
  position: absolute;
  border-radius: 28px;
  border: 1px solid rgba(54,92,255,.13);
  background: rgba(255,255,255,.74);
  box-shadow: 0 20px 50px rgba(30,55,95,.10);
}
.rp-hero-visual:before { width: 70%; height: 56%; left: 8%; top: 13%; transform: rotate(-3deg); }
.rp-hero-visual:after { width: 48%; height: 36%; right: 8%; bottom: 10%; transform: rotate(4deg); }
.rp-hero-mini {
  position: relative;
  z-index: 2;
  margin: 36px;
  padding: 18px;
  max-width: 62%;
  border-radius: 16px;
  background: rgba(255,255,255,.91);
  border: 1px solid rgba(255,255,255,.95);
  box-shadow: var(--rp-shadow-sm);
}
.rp-kicker { letter-spacing: .12em; text-transform: uppercase; font-weight: 800; }

/* Cards / grids */
.rp-category-grid,
.rp-popular-grid,
.rp-mini-grid {
  display: grid;
  gap: 16px;
}
.rp-category-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
/* Dynamic resource grids use minimum card widths instead of fixed tracks.
   This prevents a single post from collapsing into a narrow 1/4-width sliver. */
.rp-popular-grid { grid-template-columns: repeat(auto-fill,minmax(min(190px,100%),1fr)); }
.rp-mini-grid { grid-template-columns: repeat(auto-fill,minmax(min(240px,100%),1fr)); }

.rp-category-card,
.rp-resource-card,
.rp-popular-card,
.rp-query-card {
  border: 1px solid var(--rp-border);
  border-radius: var(--rp-radius-md);
  background: #fff;
  box-shadow: var(--rp-shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.rp-category-card:hover,
.rp-resource-card:hover,
.rp-popular-card:hover,
.rp-query-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 34px rgba(19,42,82,.12);
  border-color: #d8e0ef;
}
.rp-category-card { min-height: 146px; }
.rp-category-card a { text-decoration: none; }
.rp-category-icon {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  font-size: 20px;
  font-weight: 800;
  background: #eef3ff;
  color: #365cff;
}
.rp-cat-guides { background:#eef6ff; }
.rp-cat-presets { background:#f3efff; }
.rp-cat-cards { background:#fff0f8; }
.rp-cat-models { background:#eefbf6; }
.rp-cat-extensions { background:#eef7ff; }
.rp-cat-troubleshooting { background:#fff1f1; }

.rp-resource-card { overflow: hidden; height: 100%; }
.rp-resource-card__media,
.rp-popular-card img,
.rp-query-card .wp-block-post-featured-image img {
  aspect-ratio: 16/9;
  width: 100%;
  object-fit: cover;
}
.rp-resource-card__body,
.rp-popular-card__body { padding: 15px; }
.rp-resource-card__title,
.rp-popular-card__title { margin: 0; font-weight: 800; line-height: 1.25; }
.rp-resource-card__title a,
.rp-popular-card__title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.rp-resource-card__excerpt { color: var(--rp-muted); font-size: .9rem; margin-top: 8px; }
.rp-card-placeholder {
  aspect-ratio: 16/9;
  display:flex;
  align-items:center;
  justify-content:center;
  background: linear-gradient(135deg,#eef3ff,#f7efff);
  color:#526581;
  font-weight:700;
}
.rp-badge {
  display:inline-flex;
  align-items:center;
  gap:5px;
  border-radius:999px;
  padding:4px 8px;
  font-size:.72rem;
  font-weight:800;
  background:#eef3ff;
  color:#365cff;
}

/* ACF model details */
.rp-model-specs {
  display:grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap:10px;
  margin: 22px 0;
}
.rp-model-spec {
  padding: 12px 14px;
  border-radius: 14px;
  border:1px solid var(--rp-border);
  background:#f8faff;
}
.rp-model-spec__label { display:block; color:var(--rp-muted); font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.rp-model-spec__value { display:block; margin-top:3px; color:var(--wp--preset--color--navy); font-weight:800; }
.rp-test-rig {
  margin: 14px 0 24px;
  padding: 15px 18px;
  border-radius: 14px;
  background: #f3f7ff;
  border:1px solid #dfe8fb;
  color:#42536c;
  font-size:.9rem;
}
.rp-source-link { margin-top: 10px; }


/* Character card metadata */
.rp-card-details {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.35rem .55rem;
}
.rp-card-details__sep { color:#9aa8bd; }

/* Single-post featured images must preserve their natural ratio. */
.rp-article-main > .wp-block-post-featured-image img {
  width:100%;
  height:auto;
  aspect-ratio:auto !important;
  object-fit:contain !important;
}

/* Content */
.rp-article-shell { align-items:flex-start; }
.rp-article-main,
.rp-sidebar-card {
  border:1px solid var(--rp-border);
  border-radius:var(--rp-radius-md);
  background:#fff;
  box-shadow:var(--rp-shadow-sm);
}
.rp-article-main { padding: clamp(22px,3vw,44px); }
.rp-sidebar-card { padding:20px; }
.rp-post-meta { color:var(--rp-muted); font-size:.88rem; }
.rp-post-content p { line-height:1.78; }
.rp-post-content h2 { margin-top:1.8em; }
.rp-post-content h3 { margin-top:1.5em; }
.rp-post-content img { border-radius:16px; }
.rp-post-content pre { border-radius:14px; overflow:auto; }

/* Query Loop */
.rp-query-grid.wp-block-post-template { gap:20px; }
.rp-query-grid > li { margin:0; }
.rp-query-card { overflow:hidden; height:100%; }
.rp-query-card .wp-block-post-title { margin-top:0; }
.rp-query-card .wp-block-post-title a { text-decoration:none; }
.rp-query-card .wp-block-post-excerpt { color:var(--rp-muted); }

/* Search */
.rp-search-wrap .wp-block-search__inside-wrapper {
  border:1px solid var(--rp-border);
  border-radius:14px;
  padding:4px;
  background:#fff;
}
.rp-search-wrap .wp-block-search__input { border:0; }
.rp-search-wrap .wp-block-search__button { border-radius:10px; }

/* Ads: hidden until an ad system injects content */
.rp-ad-slot:empty { display:none; }
.rp-ad-slot:not(:empty) {
  display:block;
  width:100%;
  margin:24px auto;
  text-align:center;
  overflow:hidden;
}

/* Footer */
.rp-site-footer { border-top:1px solid var(--rp-border); }
.rp-site-footer a { text-decoration:none; }

/* Helpers */
.rp-section-head { margin-bottom:18px; }
.rp-section-head a { text-decoration:none; font-weight:700; }
.rp-muted { color:var(--rp-muted); }

/* Homepage sections with no returned posts should not leave empty headings/gaps. */
.rp-home-dynamic-section:not(:has(.rp-mini-grid, .rp-popular-grid)) { display:none; }
.rp-home-split { align-items:stretch; }

@media (max-width: 1080px) {
  .rp-category-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 782px) {
  .admin-bar .rp-site-header { top:46px; }
  .rp-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .rp-model-specs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rp-hero-visual { min-height:230px; }
  .rp-hero-mini { max-width:75%; margin:24px; }
  .rp-site-header { position:relative; top:auto; }
}
@media (max-width: 480px) {
  .rp-model-specs { grid-template-columns:1fr 1fr; }
  .rp-category-card { min-height:130px; }
}
