/*
Theme Name:   Astra Child — ToInvested
Theme URI:    https://toinvested.com
Description:  Child theme for ToInvested.com — Dark gold luxury investor brand
Author:       David J. Moore, MBA
Author URI:   https://toinvested.com/about/
Template:     astra
Version:      2.0.0
Text Domain:  astra-child
*/

@import url("../astra/style.css");

/* ═══════════════════════════════════════════════════════════
   TOINVESTED BRAND TOKENS
═══════════════════════════════════════════════════════════ */
:root {
  --ti-gold:        #C9A84C;
  --ti-gold-light:  #E8C96A;
  --ti-bg:          #080A0E;
  --ti-surface:     #0F1218;
  --ti-card:        #141820;
  --ti-border:      rgba(201,168,76,0.25);
  --ti-text:        #F0EDE6;
  --ti-sub:         #D0C9C0;
  --ti-muted:       #A8A098;
  --ti-green:       #22C55E;
  --ti-red:         #EF4444;
  --ti-amber:       #F59E0B;
  --ti-radius:      12px;
  --ti-font:        'Inter', 'Segoe UI', system-ui, sans-serif;
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL RESET & BASE
═══════════════════════════════════════════════════════════ */
body {
  background-color: var(--ti-bg) !important;
  color: var(--ti-text) !important;
  font-family: var(--ti-font) !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
}

/* ═══════════════════════════════════════════════════════════
   TYPOGRAPHY — BIGGER, BRIGHTER, READABLE
═══════════════════════════════════════════════════════════ */
h1, .entry-title { font-size: clamp(1.8rem, 4vw, 2.8rem) !important; color: var(--ti-text) !important; font-weight: 700 !important; line-height: 1.2 !important; }
h2              { font-size: clamp(1.4rem, 3vw, 2rem)   !important; color: var(--ti-text) !important; font-weight: 600 !important; }
h3              { font-size: clamp(1.1rem, 2.5vw, 1.5rem)!important; color: var(--ti-text) !important; font-weight: 600 !important; }
h4, h5, h6     { color: var(--ti-text) !important; font-weight: 600 !important; }

p, li, td, th, label, span {
  color: var(--ti-sub) !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
}
strong, b     { color: var(--ti-text)  !important; }
a             { color: var(--ti-gold)  !important; text-decoration: none !important; }
a:hover       { color: var(--ti-gold-light) !important; text-decoration: underline !important; }
blockquote    { border-left: 3px solid var(--ti-gold) !important; padding-left: 1.5rem !important; color: var(--ti-sub) !important; }
code, pre     { background: var(--ti-card) !important; color: var(--ti-gold-light) !important; border-radius: 6px !important; padding: 2px 6px !important; }

/* ═══════════════════════════════════════════════════════════
   FIX: GIANT SOCIAL MEDIA ICONS — THE BIG ONE
═══════════════════════════════════════════════════════════ */
.wp-block-social-links              { gap: 10px !important; }
.wp-block-social-link               { width: 36px  !important; height: 36px  !important; border-radius: 50% !important; }
.wp-block-social-link a             { width: 36px  !important; height: 36px  !important; padding: 6px  !important; }
.wp-block-social-link svg           { width: 18px  !important; height: 18px  !important; }
.wp-block-social-link img           { width: 36px  !important; height: 36px  !important; max-width: 36px !important; object-fit: cover !important; }
.entry-content img[src*="facebook"],
.entry-content img[src*="linkedin"],
.entry-content img[src*="twitter"],
.entry-content img[src*="instagram"],
.entry-content img[src*="youtube"],
.entry-content img[src*="tiktok"],
.entry-content img[class*="social"] { width: 32px !important; height: 32px !important; max-width: 32px !important; border-radius: 6px !important; }

/* All images constrained */
.entry-content img,
.page-content img,
.wp-block-image img { max-width: 100% !important; height: auto !important; border-radius: var(--ti-radius) !important; }

/* ═══════════════════════════════════════════════════════════
   HEADER & NAVIGATION
═══════════════════════════════════════════════════════════ */
.site-header,
#masthead,
.ast-site-header-wrap            { background: rgba(8,10,14,0.98) !important; border-bottom: 1px solid var(--ti-border) !important; backdrop-filter: blur(12px) !important; }
.site-title a,
.ast-site-title                  { color: var(--ti-gold) !important; font-weight: 700 !important; font-size: 1.4rem !important; }
.main-navigation a,
.ast-main-navigation a,
.main-header-menu a,
nav a                            { color: var(--ti-sub) !important; font-size: 14px !important; font-weight: 500 !important; padding: 8px 14px !important; transition: color .2s !important; }
.main-navigation a:hover,
nav a:hover                      { color: var(--ti-gold) !important; text-decoration: none !important; }
.current-menu-item > a,
.current-page-item > a           { color: var(--ti-gold) !important; }

/* ═══════════════════════════════════════════════════════════
   ASTRA HEADER BUTTONS
═══════════════════════════════════════════════════════════ */
.ast-header-html-code a,
.ast-header-button a,
.ast-custom-button,
.header-widget a.button,
.header-widget .wp-block-button__link {
  background: var(--ti-gold) !important;
  color: #080A0E !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  display: inline-block !important;
}
.ast-header-button a:hover,
.ast-custom-button:hover { background: var(--ti-gold-light) !important; color: #080A0E !important; }

/* ═══════════════════════════════════════════════════════════
   CONTENT AREA
═══════════════════════════════════════════════════════════ */
.site-content,
#content,
.ast-container                   { background: var(--ti-bg) !important; }
.content-area,
.widget-area,
#primary,
#secondary                       { background: var(--ti-bg) !important; }

/* ═══════════════════════════════════════════════════════════
   POSTS & PAGES
═══════════════════════════════════════════════════════════ */
.hentry,
.page,
article,
.ast-article-post                { background: var(--ti-bg) !important; border: none !important; padding: 0 !important; }
.entry-content                   { max-width: 780px !important; margin: 0 auto !important; }
.entry-header .entry-title       { color: var(--ti-text) !important; }
.entry-meta,
.entry-footer                    { color: var(--ti-muted) !important; font-size: 14px !important; }
.entry-meta a,
.entry-footer a                  { color: var(--ti-gold) !important; }

/* ═══════════════════════════════════════════════════════════
   CARDS & POST GRID (Blog listing)
═══════════════════════════════════════════════════════════ */
.ast-archive-post,
.post-grid-post,
.ast-grid-post-image-wrap + .ast-blog-post-element {
  background: var(--ti-card) !important;
  border: 1px solid var(--ti-border) !important;
  border-radius: var(--ti-radius) !important;
  overflow: hidden !important;
  transition: transform .2s, border-color .2s !important;
}
.ast-archive-post:hover          { transform: translateY(-3px) !important; border-color: var(--ti-gold) !important; }
.ast-blog-post-element .entry-title a { color: var(--ti-text) !important; }
.ast-blog-post-element .entry-title a:hover { color: var(--ti-gold) !important; }
.ast-post-categories a,
.ast-post-tags a                 { background: rgba(201,168,76,0.12) !important; color: var(--ti-gold) !important; border-radius: 4px !important; padding: 2px 8px !important; font-size: 12px !important; }

/* ═══════════════════════════════════════════════════════════
   SIDEBAR
═══════════════════════════════════════════════════════════ */
.widget-area,
.sidebar,
#secondary                       { background: var(--ti-bg) !important; }
.widget                          { background: var(--ti-card) !important; border: 1px solid var(--ti-border) !important; border-radius: var(--ti-radius) !important; padding: 24px !important; margin-bottom: 24px !important; }
.widget-title                    { color: var(--ti-gold) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .08em !important; text-transform: uppercase !important; border-bottom: 1px solid var(--ti-border) !important; padding-bottom: 12px !important; margin-bottom: 16px !important; }
.widget li                       { color: var(--ti-sub) !important; font-size: 15px !important; padding: 4px 0 !important; border-bottom: 1px solid rgba(255,255,255,0.04) !important; }
.widget li a                     { color: var(--ti-sub) !important; }
.widget li a:hover               { color: var(--ti-gold) !important; }

/* ═══════════════════════════════════════════════════════════
   FORMS & INPUTS
═══════════════════════════════════════════════════════════ */
input, textarea, select,
.wp-block-search__input {
  background: var(--ti-card) !important;
  border: 1px solid var(--ti-border) !important;
  border-radius: 8px !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  padding: 12px 16px !important;
}
input::placeholder, textarea::placeholder { color: var(--ti-muted) !important; }
input:focus, textarea:focus      { border-color: var(--ti-gold) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(201,168,76,0.15) !important; }
.ast-comment-form input[type="submit"],
input[type="submit"],
button[type="submit"],
.submit                          { background: var(--ti-gold) !important; color: #080A0E !important; font-weight: 700 !important; border: none !important; border-radius: 8px !important; padding: 12px 28px !important; cursor: pointer !important; font-size: 15px !important; transition: background .2s !important; }
input[type="submit"]:hover,
button[type="submit"]:hover      { background: var(--ti-gold-light) !important; }

/* ═══════════════════════════════════════════════════════════
   TABLES
═══════════════════════════════════════════════════════════ */
table                            { width: 100% !important; border-collapse: collapse !important; }
th                               { background: rgba(201,168,76,0.12) !important; color: var(--ti-gold) !important; font-weight: 700 !important; padding: 12px 16px !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: .06em !important; }
td                               { padding: 12px 16px !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; color: var(--ti-sub) !important; }
tr:hover td                      { background: rgba(255,255,255,0.02) !important; }

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
.site-footer,
#colophon,
.ast-footer-area,
.footer-widget-area              { background: #050709 !important; border-top: 1px solid var(--ti-border) !important; color: var(--ti-muted) !important; }
.site-footer a                   { color: var(--ti-sub) !important; }
.site-footer a:hover             { color: var(--ti-gold) !important; }
.ast-footer-copyright,
.footer-copyright                { color: var(--ti-muted) !important; font-size: 13px !important; }

/* ═══════════════════════════════════════════════════════════
   PAGINATION
═══════════════════════════════════════════════════════════ */
.pagination .page-numbers,
.nav-links a                     { background: var(--ti-card) !important; border: 1px solid var(--ti-border) !important; color: var(--ti-sub) !important; border-radius: 6px !important; padding: 8px 14px !important; }
.pagination .current,
.page-numbers.current            { background: var(--ti-gold) !important; color: #080A0E !important; border-color: var(--ti-gold) !important; font-weight: 700 !important; }

/* ═══════════════════════════════════════════════════════════
   COMMENTS
═══════════════════════════════════════════════════════════ */
.comments-area                   { border-top: 1px solid var(--ti-border) !important; margin-top: 48px !important; padding-top: 48px !important; }
.comment-author .fn              { color: var(--ti-gold) !important; font-weight: 600 !important; }
.comment-content p               { color: var(--ti-sub) !important; }
.comment-reply-link              { color: var(--ti-gold) !important; font-size: 13px !important; }
.comment-meta time               { color: var(--ti-muted) !important; font-size: 13px !important; }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE FIRST
═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  body      { font-size: 17px !important; }
  p, li     { font-size: 16px !important; }
  h1        { font-size: 1.8rem  !important; }
  h2        { font-size: 1.4rem  !important; }
  h3        { font-size: 1.15rem !important; }
  .entry-content { padding: 0 16px !important; }
  table     { font-size: 14px !important; }
  th, td    { padding: 8px 10px !important; }
}

/* ═══════════════════════════════════════════════════════════
   TOASTED NAV BAR (injected by functions.php)
═══════════════════════════════════════════════════════════ */
#ti-bridge-bar {
  background: rgba(8,10,14,0.98);
  border-bottom: 1px solid var(--ti-border);
  padding: 10px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13px;
  position: sticky;
  top: 0;
  z-index: 9999;
  backdrop-filter: blur(12px);
}
#ti-bridge-bar a       { color: var(--ti-sub) !important; text-decoration: none !important; padding: 4px 10px !important; border-radius: 4px !important; transition: color .15s !important; font-size: 13px !important; }
#ti-bridge-bar a:hover { color: var(--ti-gold) !important; }
#ti-bridge-bar .ti-bridge-cta {
  background: var(--ti-gold) !important;
  color: #080A0E !important;
  font-weight: 700 !important;
  padding: 7px 16px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}
#ti-bridge-bar .ti-bridge-cta:hover { background: var(--ti-gold-light) !important; color: #080A0E !important; }
.ti-bridge-logo { color: var(--ti-gold) !important; font-weight: 700 !important; font-size: 15px !important; letter-spacing: -0.3px !important; }
@media (max-width: 600px) {
  #ti-bridge-bar .ti-bridge-links { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   AFFILIATE RAIL (injected after posts)
═══════════════════════════════════════════════════════════ */
.ti-affiliate-rail {
  background: var(--ti-card);
  border: 1px solid var(--ti-border);
  border-radius: 16px;
  padding: 28px;
  margin: 48px 0 24px;
}
.ti-affiliate-rail h4 {
  color: var(--ti-gold) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  margin: 0 0 20px !important;
}
.ti-affiliate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}
.ti-affiliate-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(201,168,76,0.12);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
  transition: border-color .2s;
}
.ti-affiliate-card:hover { border-color: var(--ti-gold); }
.ti-affiliate-card .ti-aff-icon { font-size: 28px; margin-bottom: 8px; }
.ti-affiliate-card .ti-aff-name { color: var(--ti-text) !important; font-weight: 600 !important; font-size: 14px !important; display: block !important; margin-bottom: 4px !important; }
.ti-affiliate-card .ti-aff-desc { color: var(--ti-muted) !important; font-size: 12px !important; display: block !important; margin-bottom: 12px !important; }
.ti-affiliate-card .ti-aff-btn {
  display: inline-block !important;
  background: transparent !important;
  border: 1px solid var(--ti-gold) !important;
  color: var(--ti-gold) !important;
  border-radius: 6px !important;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all .2s !important;
}
.ti-affiliate-card .ti-aff-btn:hover {
  background: var(--ti-gold) !important;
  color: #080A0E !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════════════════════════════════
   COACHING CTA (appended after affiliate rail)
═══════════════════════════════════════════════════════════ */
.ti-coaching-cta {
  background: linear-gradient(135deg, rgba(201,168,76,0.08), rgba(201,168,76,0.04));
  border: 1px solid var(--ti-border);
  border-radius: 16px;
  padding: 32px;
  margin: 16px 0 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
}
.ti-coaching-cta h4 { color: var(--ti-text) !important; font-size: 1.2rem !important; margin: 0 0 6px !important; }
.ti-coaching-cta p  { color: var(--ti-sub) !important; margin: 0 !important; font-size: 15px !important; }
.ti-coaching-btn {
  display: inline-block !important;
  background: var(--ti-gold) !important;
  color: #080A0E !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  padding: 12px 24px !important;
  font-size: 15px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background .2s !important;
}
.ti-coaching-btn:hover { background: var(--ti-gold-light) !important; color: #080A0E !important; text-decoration: none !important; }

/* ═══════════════════════════════════════════════════════════
   TOOL TEASER (top of posts)
═══════════════════════════════════════════════════════════ */
.ti-tool-teaser {
  background: rgba(201,168,76,0.06);
  border: 1px solid rgba(201,168,76,0.2);
  border-left: 3px solid var(--ti-gold);
  border-radius: 0 10px 10px 0;
  padding: 14px 18px;
  margin-bottom: 32px;
  font-size: 14px !important;
}
.ti-tool-teaser span { color: var(--ti-muted) !important; }
.ti-tool-teaser a    { color: var(--ti-gold) !important; font-weight: 600 !important; }
