/*
Theme Name: Perv Depot Child
Template: astra
Description: Perv Depot -- After-Hours Field Manual. Dark tabloid editorial child theme built on Astra.
Version: 1.0.8
Author: Promomak
*/

/* ==========================================================================
   Design tokens
   ========================================================================== */
:root {
  --pd-bg: #0A0A0A;          /* Depot Black */
  --pd-surface: #171717;     /* Panel Black */
  --pd-paper: #F4F0E8;       /* Paper White */
  --pd-accent: #B7FF2A;      /* Toxic Lime */
  --pd-network: #D71920;     /* Hardlore Crimson */
  --pd-support: #8B8B84;     /* Concrete Gray */
  --pd-border: #2A2A2A;
  --pd-white: #FFFFFF;       /* Pure white -- for headline punch, avoid pale-read cream on dark bg */

  --pd-font-heading: 'Oswald', Impact, sans-serif;
  --pd-font-body: 'Inter', -apple-system, sans-serif;
  --pd-font-label: 'Roboto Mono', 'Courier New', monospace;

  --pd-container: 1240px;
  --pd-article-width: 800px;
  --pd-space-sm: 12px;
  --pd-space-md: 24px;
  --pd-space-lg: 40px;
  --pd-space-xl: 72px;
  --pd-radius-sm: 2px;
  --pd-radius-md: 4px;
}

/* ==========================================================================
   Global resets / base
   ========================================================================== */
body {
  background: var(--pd-bg) !important;
  color: var(--pd-paper) !important;
  font-family: var(--pd-font-body) !important;
  font-weight: 400;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .site-title, .page-title {
  font-family: var(--pd-font-heading) !important;
  font-weight: 700 !important;
  text-transform: none;
  letter-spacing: -0.01em;
  line-height: 1.08 !important;
  color: var(--pd-paper) !important;
}

a { color: var(--pd-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.pd-container {
  max-width: var(--pd-container);
  margin: 0 auto;
  padding: 0 var(--pd-space-md);
}

/* Eyebrow / label style, Roboto Mono */
.pd-label, .pd-eyebrow, .pd-category {
  font-family: var(--pd-font-label) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--pd-accent) !important;
}

/* ==========================================================================
   Header / nav
   ========================================================================== */
#masthead, .ast-primary-header-bar, .site-header {
  background: var(--pd-bg) !important;
  border-bottom: 1px solid var(--pd-border) !important;
}

.ast-site-title a, .site-title a, .ast-site-identity .site-title, .custom-logo-link {
  color: var(--pd-paper) !important;
}

.main-header-menu a, .ast-header-navigation-arrow {
  font-family: var(--pd-font-label) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.85rem;
  color: var(--pd-paper) !important;
}
.main-header-menu a:hover { color: var(--pd-accent) !important; }

.pd-start-here-btn, .ast-header-button .ast-button {
  background: var(--pd-accent) !important;
  color: var(--pd-bg) !important;
  font-family: var(--pd-font-label) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: var(--pd-radius-sm) !important;
  border: none !important;
  box-shadow: none !important;
  padding: 10px 20px !important;
}

.pd-network-tag {
  font-family: var(--pd-font-label);
  font-size: 0.7rem;
  color: var(--pd-network);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border: 1px solid var(--pd-network);
  padding: 2px 8px;
  border-radius: var(--pd-radius-sm);
}

/* Nav menu item variants -- header link versions of the label/button styles above */
.main-header-menu .pd-nav-network > a {
  font-family: var(--pd-font-label) !important;
  font-size: 0.7rem !important;
  color: var(--pd-network) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border: 1px solid var(--pd-network);
  padding: 4px 10px !important;
  border-radius: var(--pd-radius-sm);
}
.main-header-menu .pd-start-here-btn > a {
  background: var(--pd-accent) !important;
  color: var(--pd-bg) !important;
  font-family: var(--pd-font-label) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: var(--pd-radius-sm) !important;
  padding: 8px 16px !important;
}
.main-header-menu .pd-start-here-btn > a:hover {
  color: var(--pd-bg) !important;
  text-decoration: none;
  opacity: 0.9;
}

/* ==========================================================================
   Post cards
   Astra's .ast-article-post / .entry classes ship their own white
   "separate container" background at similar specificity, so these
   need !important to reliably win the cascade.
   ========================================================================== */
.pd-card,
article.pd-card {
  background: var(--pd-surface) !important;
  border: 1px solid var(--pd-border) !important;
  border-radius: var(--pd-radius-md);
  overflow: hidden;
  box-shadow: none !important;
}
.pd-card__image { aspect-ratio: 16/9; object-fit: cover; width: 100%; display: block; }
.pd-card__body { padding: var(--pd-space-md); background: transparent !important; }
.pd-card__label { margin-bottom: 8px; display: block; }
.pd-card__title {
  font-family: var(--pd-font-heading);
  font-size: 1.4rem;
  font-weight: 700;
  margin: 4px 0 8px;
}
.pd-card__title,
.pd-card__title a {
  color: var(--pd-paper) !important;
}
.pd-card__title a:hover { color: var(--pd-accent) !important; }
.pd-card__deck { color: var(--pd-support) !important; font-size: 0.95rem; line-height: 1.5; }
.pd-card__meta {
  font-family: var(--pd-font-label);
  font-size: 0.7rem;
  color: var(--pd-support) !important;
  text-transform: uppercase;
  margin-top: 10px;
}

/* ==========================================================================
   Archive / category listing (Astra's native loop markup)
   Astra's own dynamic customizer CSS sets link/excerpt colors for a
   light theme at higher specificity than our global body/a rules, so
   those win the cascade on category pages and produce paper-on-paper
   or muddy-gray-on-black text. Target the real markup classes
   directly (verified against live output) instead of relying on
   inheritance.
   ========================================================================== */
.ast-archive-description .ast-archive-title,
.ast-archive-description .page-title {
  color: var(--pd-white) !important;
  font-family: var(--pd-font-heading) !important;
}

article.ast-article-post .entry-title,
article.ast-article-post .entry-title a {
  color: var(--pd-white) !important;
  font-family: var(--pd-font-heading) !important;
  font-weight: 700 !important;
}
article.ast-article-post .entry-title a:hover {
  color: var(--pd-accent) !important;
}

article.ast-article-post .ast-excerpt-container,
article.ast-article-post .ast-excerpt-container p {
  color: var(--pd-support) !important;
  font-family: var(--pd-font-body) !important;
  font-weight: 400 !important;
  font-size: 0.95rem;
  line-height: 1.5;
}

article.ast-article-post .entry-meta,
article.ast-article-post .entry-meta .posted-on,
article.ast-article-post .entry-meta .posted-on span {
  color: var(--pd-support) !important;
  font-family: var(--pd-font-label) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.7rem;
}

article.ast-article-post .ast-taxonomy-container.cat-links,
article.ast-article-post .ast-taxonomy-container.cat-links a {
  font-family: var(--pd-font-label) !important;
  color: var(--pd-accent) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  text-decoration: none;
}
article.ast-article-post .ast-taxonomy-container.cat-links a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   Callouts (Don't Be That Guy / Red Flags / Perv Depot Rules)
   ========================================================================== */
.pd-callout {
  background: var(--pd-surface) !important;
  border: 1px solid var(--pd-border);
  border-left: 4px solid var(--pd-accent);
  border-radius: var(--pd-radius-sm);
  padding: var(--pd-space-md);
  margin: var(--pd-space-lg) 0;
  color: var(--pd-paper) !important;
}
.pd-callout--warning { border-left-color: var(--pd-network); }
.pd-callout__label {
  font-family: var(--pd-font-label);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.75rem;
  color: var(--pd-accent) !important;
  display: block;
  margin-bottom: 8px;
}
.pd-callout--warning .pd-callout__label { color: var(--pd-network) !important; }

/* ==========================================================================
   Article / long-form reading panel
   ========================================================================== */
.pd-article {
  background: var(--pd-paper) !important;
  color: var(--pd-bg) !important;
  border-radius: var(--pd-radius-md);
  padding: var(--pd-space-xl) var(--pd-space-lg);
  max-width: var(--pd-article-width);
  margin: 0 auto;
}
.pd-article h1, .pd-article h2, .pd-article h3,
.pd-article .entry-title { color: var(--pd-bg) !important; }
.pd-article p, .pd-article li { color: var(--pd-bg) !important; line-height: 1.7; }
.pd-article a { color: #1a6b00; }

/* Callout boxes nested inside the light article panel must keep their
   own dark-panel text color -- .pd-article p above would otherwise win. */
.pd-article .pd-callout p,
.pd-article .pd-callout li,
.pd-article .pd-callout ol,
.pd-article .pd-callout ul { color: var(--pd-paper) !important; }
.pd-article .pd-callout strong { color: var(--pd-paper) !important; }

.pd-hero__title, .pd-hero__title a {
  color: var(--pd-paper) !important;
}
.pd-hero__title a:hover { color: var(--pd-accent) !important; }

/* ==========================================================================
   Sections
   ========================================================================== */
.pd-section { padding: var(--pd-space-xl) 0; }
.pd-section-title {
  font-family: var(--pd-font-heading);
  font-size: 1.8rem;
  margin-bottom: var(--pd-space-lg);
  color: var(--pd-paper) !important;
}

.pd-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pd-space-md);
}

@media (max-width: 782px) {
  .pd-grid-3 { grid-template-columns: 1fr; }
  .pd-section { padding: var(--pd-space-lg) 0; }
  :root { --pd-space-xl: 40px; }
}

/* Footer */
#colophon, .site-footer, .ast-footer-container,
.site-above-footer-wrap, .site-below-footer-wrap {
  background: var(--pd-surface) !important;
  border-top: 1px solid var(--pd-border) !important;
  color: var(--pd-support) !important;
}
.ast-footer-copyright, .ast-footer-copyright a {
  color: var(--pd-support) !important;
}
.ast-footer-copyright a:hover { color: var(--pd-accent) !important; }

/* Site-wide Hardlore Network footer signature (rendered via wp_footer) */
.pd-footer-signature {
  background: var(--pd-bg);
  border-top: 1px solid var(--pd-border);
  padding: var(--pd-space-md) 0;
}
.pd-footer-signature__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--pd-space-md);
  flex-wrap: wrap;
  text-align: center;
}
.pd-footer-signature__text {
  color: var(--pd-support);
  font-size: 0.85rem;
}
.pd-footer-signature__text a {
  color: var(--pd-accent);
}
