/*
 Theme Name:  Astra Child
 Template:    astra
*/

/* =========================
   Base + tokens
   ========================= */
:root{
  --pcp-blue:#2563eb;
  --pcp-blue-dark:#1d4ed8;
  --pcp-text:#0f172a;
  --pcp-muted:#64748b;
  --pcp-border:#e5e7eb;
  --pcp-radius:14px;
  --pcp-card-shadow:0 1px 6px rgba(15,23,42,.05);
  --pcp-card-shadow-hover:0 8px 24px rgba(15,23,42,.08);
}

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:#fff;
  color:#334155;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* Guard against accidental vertical writing/glitches */
.entry-title, .entry-title a,
.blog .entry-content p, .archive .entry-content p, .search .entry-content p{
  writing-mode:horizontal-tb !important;
  white-space:normal !important;
  transform:none !important;
}

/* =========================
   Featured images
   ========================= */
.single-post .entry-featured-image img,
.single-post .ast-single-post-featured-section img,
.blog .post-thumb img,
.archive .post-thumb img{
  display:block; width:100%; height:auto; border-radius:12px;
}

/* force 16:9 thumbnails on archives if our PHP adds class="pcp-thumb" */
.pcp-thumb{
  display:block; width:100%; height:auto; border-radius:12px;
  aspect-ratio:16/9; object-fit:cover; background:#f3f4f6;
}

/* =========================
   Single post: remove theme hero wrappers
   ========================= */
.single-post .page-hero,
.single-post .entry-hero,
.single-post .hero-section,
.single-post .ast-single-post-featured-section,
.single-post .site-content .entry-header{
  display:none !important; margin:0 !important; padding:0 !important;
  min-height:0 !important; border:0 !important; background:transparent !important;
}
.single-post .site-main > .ct-container,
.single-post .site-main > article,
.single-post .entry-content{ margin-top:0 !important; padding-top:0 !important; }
.single-post .entry-content > .hero:first-child{ margin-top:0 !important; }

/* =========================
   Blog / archive UI (CTR + AdSense friendly)
   ========================= */
.pcp-blog-hero{
  max-width:1100px; margin:24px auto 12px;
  padding:22px 18px 18px;
  background:#fff; border:1px solid var(--pcp-border);
  border-radius:var(--pcp-radius);
  box-shadow:0 4px 10px rgba(16,24,40,.06);
  text-align:center; /* center everything in hero */
}
.pcp-blog-hero h1{
  margin:0 0 8px;
  font-size:clamp(1.6rem,3.8vw,2.1rem);
  line-height:1.25; color:var(--pcp-text); font-weight:800;
}
.pcp-hero-sub{
  margin:0 auto 16px; color:#475569;
  font-size:clamp(.95rem,2.2vw,1.05rem); max-width:720px;
}

/* Hero search – single visible submit, centered */
.pcp-hero-search{ margin:0 auto 14px; }
.pcp-hero-search .search-form{
  display:flex; gap:8px; max-width:560px; margin:0 auto; justify-content:center;
}
.pcp-hero-search .search-form .search-field{
  flex:1; padding:12px 14px; border:1px solid #dbe3ea; border-radius:10px; font-size:16px; background:#fff;
}
.pcp-hero-search .search-form .search-field:focus{
  outline:none; border-color:var(--pcp-blue); box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
/* Hide any duplicate submit controls/icons the theme may print */
.pcp-hero-search .search-form [type="submit"]{ padding:12px 16px; border-radius:10px; background:var(--pcp-blue); color:#fff; border:0; cursor:pointer; font-weight:700; white-space:nowrap; }
.pcp-hero-search .search-form [type="submit"]:not(:last-of-type){ display:none !important; }
.pcp-hero-search .search-form .search-submit .icon,
.pcp-hero-search .search-form .search-submit svg{ display:none; } /* remove duplicate icon inside button */
.pcp-hero-search .search-form [type="submit"]:hover{ background:var(--pcp-blue-dark); }

/* Hide WebKit’s built-in search decorations for a cleaner look */
.pcp-hero-search input[type="search"]::-webkit-search-decoration,
.pcp-hero-search input[type="search"]::-webkit-search-cancel-button,
.pcp-hero-search input[type="search"]::-webkit-search-results-button,
.pcp-hero-search input[type="search"]::-webkit-search-results-decoration{ display:none; }

/* Category chips – centered and scrollable on tiny screens */
.pcp-hero-chips{ margin-top:12px; display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.pcp-hero-chips .chip{
  display:inline-block; padding:8px 12px; font-size:13px; border-radius:999px;
  background:#e7efff; color:#1d4ed8; text-decoration:none; border:1px solid #cde0ff;
  transition:all .15s ease; font-weight:600;
}
.pcp-hero-chips .chip:hover{ background:#dbeafe; transform:translateY(-2px); }

/* Post cards */
.blog .site-main article,
.archive .site-main article{
  background:#fff; border:1px solid #eef2f7; border-radius:14px;
  padding:16px; margin:0 0 20px; box-shadow:var(--pcp-card-shadow);
  transition:transform .2s ease, box-shadow .2s ease;
}
.blog .site-main article:hover,
.archive .site-main article:hover{ transform:translateY(-2px); box-shadow:var(--pcp-card-shadow-hover); }

.blog .entry-title, .archive .entry-title{ margin-top:0; font-size:clamp(1.15rem,2.6vw,1.4rem); line-height:1.3; }
.blog .entry-title a, .archive .entry-title a{ color:#0f172a; text-decoration:none; }
.blog .entry-title a:hover, .archive .entry-title a:hover{ color:var(--pcp-blue); }

/* Meta row under titles (date • read time) */
.pcp-card-meta{
  display:flex; gap:10px; align-items:center;
  margin:8px 0 10px; font-size:13px; color:var(--pcp-muted); flex-wrap:wrap; justify-content:flex-start;
}
.pcp-card-meta span:nth-child(2){ opacity:.6; }

/* Excerpt */
.blog .entry-content p, .archive .entry-content p{ margin:8px 0 12px; color:#374151; }

/* Read more */
.pcp-card-readmore{
  display:inline-block; padding:9px 13px; border-radius:10px;
  background:#eff4ff; border:1px solid #dbe3ff; color:#1d4ed8; text-decoration:none; font-weight:700;
  transition:all .15s ease;
}
.pcp-card-readmore:hover{ background:var(--pcp-blue); color:#fff; border-color:var(--pcp-blue); }

/* CLS-safe in-feed ad placeholder (replace with real AdSense) */
.pcp-infeed-ad{ margin:16px 0 22px; }
.pcp-infeed-ad .ad-placeholder{
  min-height:120px; border:1px dashed #cbd5e1; border-radius:14px;
  display:flex; align-items:center; justify-content:center; color:#64748b; background:#f8fafc;
}

/* =========================
   TOC & content blocks inside posts
   ========================= */
.toc{ background:#f8f9fa; border-radius:8px; padding:20px; margin:20px 0; }
.toc-title{ font-size:1.1rem; margin-bottom:10px; color:#2c3e50; font-weight:700; text-align:left; }
.toc-list{ list-style:none; columns:2; }
.toc-list li{ margin-bottom:8px; break-inside:avoid; }
.toc-list a{ color:#2980b9; text-decoration:none; }
.toc-list a:hover{ text-decoration:underline; }

.hero{ text-align:center; margin:0 0 30px; }
.hero-caption{ font-style:italic; color:#666; margin-top:8px; font-size:.9rem; }

/* =========================
   Footer
   ========================= */
.f-adbar{ min-height:90px; }
@media (max-width:640px){ .f-adbar{ min-height:100px; } }
.f-bottom{ border-top:1px solid #eef2f7; }
@media (max-width:640px){
  .f-bottom{ display:flex; flex-direction:column; gap:10px; }
}

/* =========================
   Responsive
   ========================= */
@media (max-width:768px){
  .pcp-blog-hero{ margin:12px auto 8px; padding:16px; }
  .pcp-blog-hero h1{ font-size:22px; }
  .pcp-hero-search .search-form{ flex-direction:column; }
  .pcp-hero-search .search-form [type="submit"]{ width:100%; }
  .toc-list{ columns:1; }
}
@media (max-width:575.98px){
  .blog .site-main article, .archive .site-main article{ padding:14px; }
  .pcp-hero-chips{ overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; padding-bottom:6px; }
  .pcp-hero-chips .chip{ white-space:nowrap; }
}

/* High-DPI borders */
@media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi){
  .blog .site-main article, .archive .site-main article{ border-width:.5px; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
}
