/*
Theme Name:   BlogAuthority Child
Theme URI:    https://blogauthority.ai
Description:  BlogAuthority child theme for GeneratePress
Author:       BlogAuthority
Author URI:   https://blogauthority.ai
Template:     generatepress
Version:      1.0.1
Text Domain:  blogauthority-child
*/

/* =============================================
   GOOGLE FONTS
   Must be first rule in the file
   ============================================= */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,600&family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* =============================================
   CSS VARIABLES
   ============================================= */
:root {
  --ba-bg:        #090B10;
  --ba-surface:   #10131B;
  --ba-surface2:  #161A25;
  --ba-border:    #1C2130;
  --ba-border2:   #252C3E;
  --ba-gold:      #C8922A;
  --ba-gold-lt:   #E4B86A;
  --ba-gold-dim:  rgba(200,146,42,0.12);
  --ba-text:      #EDE9E2;
  --ba-text-2:    #9A9690;
  --ba-text-3:    #5E5C58;
  --ba-green:     #2A9D5C;
  --ba-radius:    6px;
}

/* =============================================
   GLOBAL BASE
   ============================================= */
body {
  background: var(--ba-bg) !important;
  color: var(--ba-text);
  font-family: 'DM Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Remove GeneratePress default white backgrounds */
.site-content,
.content-area,
#page {
  background: var(--ba-bg);
}

/* =============================================
   HEADER
   GeneratePress structure:
   #site-header .site-header
     └── .inside-header  (logo lives here)
   #site-navigation .main-navigation
     └── .inside-navigation  (menu lives here)

   Both must be dark for a unified header look.
   ============================================= */

/* Wrapper that holds both header and nav */
.site-header,
#site-header {
  background: var(--ba-bg) !important;
  border-bottom: none !important;
  padding: 0 !important;
}

/* Logo container */
.inside-header {
  background: var(--ba-bg) !important;
  padding: 0 40px !important;
  min-height: 64px;
  display: flex;
  align-items: center;
}

/* Nav container — this is the one that was white */
.main-navigation,
#site-navigation,
.nav-primary,
.nav-primary .inside-navigation,
.main-navigation .inside-navigation {
  background: var(--ba-bg) !important;
  border-bottom: 1px solid var(--ba-border) !important;
}

.main-navigation .inside-navigation {
  max-width: 100%;
  padding: 0 40px;
  display: flex;
  align-items: center;
  min-height: 52px;
}

/* =============================================
   SITE TITLE / LOGO
   ============================================= */
.site-branding .site-title,
.site-branding .site-title a {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--ba-text) !important;
  text-decoration: none;
  letter-spacing: -0.02em;
}
.site-branding .site-title a:hover {
  color: var(--ba-gold-lt) !important;
}
.site-description {
  display: none;
}

/* =============================================
   NAVIGATION LINKS
   ============================================= */
.main-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.main-navigation ul li a {
  color: var(--ba-text-2) !important;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  padding: 6px 14px;
  border-radius: var(--ba-radius);
  transition: color 0.2s, background 0.2s;
  display: block;
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a,
.main-navigation ul li.current-page-ancestor > a {
  color: var(--ba-text) !important;
  background: rgba(255,255,255,0.04);
}

/* =============================================
   GET EARLY ACCESS — GOLD CTA BUTTON
   Targets the nav-cta-item class added by
   functions.php based on menu item title.
   ============================================= */
.main-navigation ul li.nav-cta-item > a,
.main-navigation ul li.nav-cta-item > a:visited {
  background: var(--ba-gold) !important;
  color: var(--ba-bg) !important;
  padding: 8px 20px !important;
  border-radius: var(--ba-radius) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.01em;
}
.main-navigation ul li.nav-cta-item > a:hover {
  background: var(--ba-gold-lt) !important;
  color: var(--ba-bg) !important;
  opacity: 1 !important;
}

/* Hide mobile nav toggle (style later if needed) */
.menu-toggle { display: none; }

/* =============================================
   CONTENT AREA
   ============================================= */
.site-main,
.content-area,
.entry-content,
.page-content {
  background: var(--ba-bg);
  color: var(--ba-text);
}

/* =============================================
   BLOG — POST LISTING
   ============================================= */
.post-summary,
article.post,
article.page {
  background: var(--ba-surface);
  border: 1px solid var(--ba-border);
  border-radius: 8px;
  padding: 32px;
  margin-bottom: 20px;
  transition: border-color 0.2s, transform 0.2s;
}
.post-summary:hover,
article.post:hover {
  border-color: var(--ba-border2);
  transform: translateY(-2px);
}

.entry-title a {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 700;
  color: var(--ba-text) !important;
  text-decoration: none;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.entry-title a:hover {
  color: var(--ba-gold-lt) !important;
}

.entry-meta,
.entry-meta a {
  font-size: 12px;
  color: var(--ba-text-3) !important;
  margin-bottom: 12px;
}

.entry-summary,
.entry-summary p {
  font-size: 15px;
  color: var(--ba-text-2);
  line-height: 1.7;
  font-weight: 300;
}

/* =============================================
   SINGLE POST / PAGE CONTENT
   ============================================= */
.entry-content {
  font-size: 17px;
  line-height: 1.8;
  color: var(--ba-text-2);
  font-weight: 300;
  max-width: 720px;
}
.entry-content h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px;
  font-weight: 700;
  color: var(--ba-text);
  margin: 48px 0 20px;
  letter-spacing: -0.02em;
}
.entry-content h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  color: var(--ba-text);
  margin: 36px 0 14px;
}
.entry-content p { margin-bottom: 20px; }
.entry-content a {
  color: var(--ba-gold-lt);
  text-decoration: none;
  border-bottom: 1px solid rgba(200,146,42,0.3);
  transition: border-color 0.2s;
}
.entry-content a:hover { border-bottom-color: var(--ba-gold-lt); }
.entry-content strong { color: var(--ba-text); font-weight: 600; }
.entry-content code {
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  background: var(--ba-surface2);
  border: 1px solid var(--ba-border);
  padding: 2px 8px;
  border-radius: 4px;
  color: var(--ba-gold-lt);
}
.entry-content pre {
  background: var(--ba-surface2);
  border: 1px solid var(--ba-border);
  border-radius: 8px;
  padding: 24px;
  overflow-x: auto;
  margin-bottom: 24px;
}
.entry-content blockquote {
  border-left: 2px solid var(--ba-gold);
  padding-left: 24px;
  margin: 28px 0;
  font-style: italic;
  color: var(--ba-text);
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
}
.entry-content ul,
.entry-content ol {
  padding-left: 24px;
  margin-bottom: 20px;
}
.entry-content li { margin-bottom: 8px; }

/* =============================================
   SIDEBAR — HIDDEN
   ============================================= */
.sidebar-area,
.widget-area,
#sidebar { display: none !important; }

/* =============================================
   FOOTER
   ============================================= */
.site-footer,
#colophon {
  background: var(--ba-bg) !important;
  border-top: 1px solid var(--ba-border) !important;
  padding: 32px 40px !important;
  font-size: 13px;
  color: var(--ba-text-3);
  text-align: center;
}
.site-footer a,
#colophon a {
  color: var(--ba-text-3) !important;
  text-decoration: none;
}
.site-footer a:hover,
#colophon a:hover {
  color: var(--ba-text-2) !important;
}

/* =============================================
   PAGINATION
   ============================================= */
.pagination { margin: 48px 0; text-align: center; }
.pagination .page-numbers {
  display: inline-flex;
  background: var(--ba-surface);
  border: 1px solid var(--ba-border);
  padding: 8px 16px;
  border-radius: var(--ba-radius);
  color: var(--ba-text-2);
  text-decoration: none;
  font-size: 14px;
  margin: 0 4px;
}
.pagination .page-numbers.current {
  background: var(--ba-gold);
  color: var(--ba-bg);
  border-color: var(--ba-gold);
}

/* =============================================
   WIPE OUT ANY REMAINING WHITE BACKGROUNDS
   Catches GeneratePress wrappers we may have
   missed and any plugin-injected elements.
   ============================================= */
.hfeed,
.page-template-default .site,
.grid-container {
  background: var(--ba-bg) !important;
}

/* =============================================
   SITE TITLE — HIGH SPECIFICITY FIX
   ============================================= */
#site-header .inside-header .site-branding,
.inside-header .site-branding {
  display: flex;
  align-items: center;
}

#site-header .site-title,
#site-header .site-title a,
.inside-header .site-title,
.inside-header .site-title a,
.site-branding h1.site-title a,
.site-branding p.site-title a {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--ba-text) !important;
  text-decoration: none !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
}

#site-header .site-title a:hover,
.inside-header .site-title a:hover {
  color: var(--ba-gold-lt) !important;
}