/* TwitcherDeck — Wildwood dark theme applied globally */

/* -- GLOBAL BODY ------------------------------------------- */
body {
  background: #0f1a14 !important;
  color: #eef3ec !important;
  font-family: 'Outfit', system-ui, sans-serif !important;
}

/* -- NAV ---------------------------------------------------- */
.td-nav {
  background: rgba(16,28,20,0.92) !important;
  border-bottom-color: rgba(255,255,255,0.10) !important;
}
.td-nav-logo-text { color: #eef3ec !important; }
.td-nav-logo-text span { color: #5fbf7a !important; }
nav ul a { color: #8fa896 !important; }
nav ul a:hover { color: #eef3ec !important; }
.nav-cta { background: #5fbf7a !important; color: #06140b !important; }
.nav-cta:hover { background: #4aad65 !important; }

/* -- PAGE HERO --------------------------------------------- */
.td-page-hero {
  background: #0a120d !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
  padding: calc(68px + 3rem) 2rem 3rem !important;
}
.td-page-hero h1 { color: #eef3ec !important; font-family: 'Fraunces', Georgia, serif !important; }
.td-page-hero p  { color: #8fa896 !important; }
.td-label { color: #5fbf7a !important; }

/* -- SECTIONS ---------------------------------------------- */
.td-section,
.td-section-full { background: #0f1a14 !important; }

/* -- CARDS -------------------------------------------------- */
.td-card {
  background: #15241b !important;
  border-color: rgba(255,255,255,0.10) !important;
}
.td-card:hover { box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important; }

/* -- SPECIES CARDS ----------------------------------------- */
.td-species-card {
  background: #15241b !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.td-card-body { background: #1b2e22 !important; }
.td-card-name { color: #eef3ec !important; }
.td-card-latin { color: #8fa896 !important; }

.td-rarity-common .td-card-header    { background: rgba(107,114,128,0.15) !important; }
.td-rarity-uncommon .td-card-header  { background: rgba(47,143,91,0.15) !important; }
.td-rarity-rare .td-card-header      { background: rgba(42,111,219,0.15) !important; }
.td-rarity-legendary .td-card-header { background: rgba(139,92,246,0.15) !important; }

.td-rarity-badge.common    { background: rgba(107,114,128,0.2) !important; color: #9ca3af !important; }
.td-rarity-badge.uncommon  { background: rgba(47,143,91,0.2)  !important; color: #5fbf7a !important; }
.td-rarity-badge.rare      { background: rgba(42,111,219,0.2) !important; color: #60a5fa !important; }
.td-rarity-badge.legendary { background: rgba(224,160,11,0.2) !important; color: #e0a00b !important; }

/* -- LOG SIGHTING FORM ------------------------------------- */
.td-log-sighting { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-log-body { background: #15241b !important; }
.td-field label { color: #eef3ec !important; }
.td-field input,
.td-field textarea,
.td-field select {
  background: #0f1a14 !important;
  border-color: rgba(255,255,255,0.15) !important;
  color: #eef3ec !important;
}
.td-field input:focus,
.td-field textarea:focus { border-color: #5fbf7a !important; }
.td-field input::placeholder,
.td-field textarea::placeholder { color: #8fa896 !important; }
.td-checkbox { color: #8fa896 !important; }
.td-autocomplete { background: #15241b !important; border-color: rgba(255,255,255,0.1) !important; }
.td-autocomplete-item:hover { background: #1b2e22 !important; }
.td-autocomplete-item .td-ac-name  { color: #eef3ec !important; }
.td-autocomplete-item .td-ac-latin { color: #8fa896 !important; }

/* -- BUTTONS ----------------------------------------------- */
.td-btn-primary { background: #5fbf7a !important; color: #06140b !important; }
.td-btn-primary:hover { background: #4aad65 !important; }
.td-btn-outline { border-color: rgba(255,255,255,0.2) !important; color: #eef3ec !important; }
.td-btn-outline:hover { border-color: #5fbf7a !important; color: #5fbf7a !important; background: transparent !important; }
.td-btn-ghost { color: #8fa896 !important; }
.td-btn-ghost:hover { color: #eef3ec !important; }

/* -- LIFE LIST STATS --------------------------------------- */
.td-stat-box { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-stat-num { color: #eef3ec !important; }
.td-stat-label { color: #8fa896 !important; }

/* -- PROGRESS BAR ------------------------------------------ */
.td-progress-bar { background: rgba(255,255,255,0.08) !important; }
.td-progress-label { color: #8fa896 !important; }

/* -- FILTER BUTTONS ---------------------------------------- */
.td-filter-btn {
  background: #15241b !important;
  border-color: rgba(255,255,255,0.12) !important;
  color: #8fa896 !important;
}
.td-filter-btn:hover,
.td-filter-btn.active { background: #5fbf7a !important; color: #06140b !important; border-color: #5fbf7a !important; }

/* -- MILESTONES -------------------------------------------- */
.td-milestone { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-milestone.earned { border-left-color: #5fbf7a !important; }
.td-milestone-name { color: #eef3ec !important; }
.td-milestone-date { color: #8fa896 !important; }
.td-milestone.done .ms-dot { background: #5fbf7a !important; }
.ms-dot { background: rgba(255,255,255,0.08) !important; }

/* -- DONATE / FLOCK ---------------------------------------- */
.td-flock-tier { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-tier-label { color: #eef3ec !important; }
.td-tier-price { color: #5fbf7a !important; }
.td-tier-entries { color: #8fa896 !important; }
.td-donate-intro h3 { color: #eef3ec !important; }
.td-donate-intro p  { color: #8fa896 !important; }
.td-donate-small    { color: #8fa896 !important; }

/* -- PHOTO CARDS ------------------------------------------- */
.td-photo-card { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-photo-species { color: #eef3ec !important; }
.td-photo-meta    { color: #8fa896 !important; }
.td-photo-likes   { color: #8fa896 !important; }
.td-photo-user    { color: #8fa896 !important; }
.td-like-btn { border-color: rgba(255,255,255,0.12) !important; color: #8fa896 !important; }
.td-like-btn:hover { background: rgba(224,160,11,0.1) !important; border-color: #e0a00b !important; color: #e0a00b !important; }

/* -- MAP SECTION ------------------------------------------- */
.map-section,
.td-map-section { background: #0a120d !important; }
.map-title { color: #eef3ec !important; }
.map-body  { color: #8fa896 !important; }
.mp-icon { background: rgba(255,255,255,0.07) !important; }
.mp-text strong { color: #eef3ec !important; }
.mp-text span   { color: #8fa896 !important; }

/* -- NOTICES ----------------------------------------------- */
.td-notice { background: rgba(95,191,122,0.1) !important; color: #5fbf7a !important; border-left-color: #5fbf7a !important; }
.td-error-msg { background: rgba(255,87,34,0.1) !important; color: #ff6b4a !important; }

/* -- VALUE CARDS ------------------------------------------- */
.value-card,
.td-card.value-card { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.vc-title { color: #eef3ec !important; }
.vc-desc  { color: #8fa896 !important; }

/* -- PULL QUOTE -------------------------------------------- */
.td-pullquote,
.pull-quote { background: #0a120d !important; border-left-color: #5fbf7a !important; color: #eef3ec !important; }
.pull-quote cite { color: #8fa896 !important; }

/* -- AUTH PAGES -------------------------------------------- */
.td-auth-wrap { background: #0a120d !important; }
.td-auth-card { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.td-auth-body { background: #15241b !important; }

/* -- MODE CARDS -------------------------------------------- */
.mode-card { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.mode-title { color: #eef3ec !important; }
.mode-desc  { color: #8fa896 !important; }
.mode-features li { color: #8fa896 !important; }

/* -- PAGE CONTENT (blog/default) --------------------------- */
.td-page-content h1,
.td-page-content h2,
.td-page-content h3 { color: #eef3ec !important; }
.td-page-content p,
.td-page-content li { color: #8fa896 !important; }
.td-page-content a  { color: #5fbf7a !important; }

/* -- PHILOSOPHY / ABOUT ------------------------------------ */
.phil-title { color: #eef3ec !important; }
.phil-body p { color: #8fa896 !important; }
.td-philosophy-section { background: #0a120d !important; border-color: rgba(255,255,255,0.08) !important; }

/* -- GENERAL TEXT ------------------------------------------ */
h1, h2, h3, h4, h5, h6 { color: #eef3ec !important; }
p { color: #8fa896 !important; }
body { color: #eef3ec !important; }

/* -- RARITY KEY -------------------------------------------- */
.rk-label { color: #8fa896 !important; }

/* -- PRICING ----------------------------------------------- */
.price-card { background: #15241b !important; border-color: rgba(255,255,255,0.08) !important; }
.price-card.featured { background: #5fbf7a !important; }
.plan-name   { color: #8fa896 !important; }
.plan-period { color: #8fa896 !important; }
.plan-price  { color: #eef3ec !important; }
.plan-features li { color: #8fa896 !important; }
.plan-features li.on { color: #eef3ec !important; }
.plan-btn { border-color: rgba(255,255,255,0.15) !important; color: #8fa896 !important; }
.plan-btn:hover { border-color: #5fbf7a !important; color: #5fbf7a !important; }
.price-card.featured .plan-btn { background: #06140b !important; color: #5fbf7a !important; border-color: transparent !important; }

/* -- FOOTER ------------------------------------------------- */
.td-footer { background: #0a120d !important; border-top: 1px solid rgba(255,255,255,0.08) !important; }
.td-footer-logo { color: #eef3ec !important; }
.td-footer-logo span { color: #5fbf7a !important; }
.td-footer-copy { color: rgba(238,243,236,0.3) !important; }
.td-footer-col-title { color: rgba(238,243,236,0.4) !important; }
.td-footer-col ul a { color: rgba(238,243,236,0.5) !important; }
.td-footer-col ul a:hover { color: #eef3ec !important; }
.td-footer-bottom { background: #0a120d !important; border-top-color: rgba(255,255,255,0.06) !important; }
.td-footer-bottom .td-container { color: rgba(238,243,236,0.3) !important; }
.td-footer-conservation { color: rgba(95,191,122,0.6) !important; }

/* -- SCROLLBAR --------------------------------------------- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0a120d; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.16); border-radius: 4px; }

/* -- GOOGLE FONTS for inner pages -------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,700;1,9..144,700&family=Outfit:wght@400;500;600;700&display=swap');

/* -- SPECIES SINGLE PAGE ----------------------------------- */
.td-species-single { background: #0f1a14; min-height: 100vh; }

.td-species-breadcrumb {
  background: #0a120d; border-bottom: 1px solid rgba(255,255,255,0.08);
  padding: 0.75rem 0;
}
.td-species-breadcrumb a { color: #5fbf7a; font-size: 0.85rem; }
.td-species-breadcrumb span { color: #8fa896; font-size: 0.85rem; margin: 0 0.5rem; }

.td-species-hero { padding: 4rem 0; background: #0a120d; border-bottom: 1px solid rgba(255,255,255,0.08); }
.td-species-hero-inner { display: grid; grid-template-columns: 260px 1fr; gap: 4rem; align-items: start; }

.td-species-card-wrap { display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.td2-card-hero { width: 240px; border-radius: 18px; padding: 14px; box-shadow: 0 30px 80px rgba(0,0,0,0.5); }
.td2-card-hero .td2-card-art { aspect-ratio: 1; border-radius: 12px; }
.td2-card-hero .td2-card-letter { font-size: 100px; }
.td2-card-hero .td2-card-name { font-size: 16px; margin-top: 12px; }
.td2-card-hero .td2-card-sci  { font-size: 11px; }

.td-species-in-deck {
  background: rgba(95,191,122,0.1); border: 1px solid rgba(95,191,122,0.3);
  border-radius: 8px; padding: 0.5rem 1rem; font-size: 0.85rem;
  color: #5fbf7a; font-weight: 600;
}

.td-species-title  { font-family: 'Fraunces', serif; font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 700; color: #eef3ec; margin: 0.5rem 0 0; letter-spacing: -0.02em; }
.td-species-latin  { font-style: italic; color: #8fa896; font-size: 1.1rem; margin: 0.25rem 0 1.5rem; }
.td-species-description { color: #8fa896; line-height: 1.75; font-size: 1rem; margin-bottom: 2rem; }
.td-species-description p { color: #8fa896 !important; }

.td-species-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; }
.td-species-meta-item { background: #15241b; border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 1rem; }
.td-species-meta-label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.1em; color: #8fa896; font-weight: 600; margin-bottom: 0.35rem; }
.td-species-meta-value { font-size: 0.9rem; color: #eef3ec; font-weight: 500; }

.td-species-cta { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; }
.td-species-logged { color: #5fbf7a; font-weight: 600; font-size: 0.9rem; display: flex; align-items: center; gap: 0.4rem; }

.td-species-sightings { padding: 4rem 0; background: #0f1a14; border-top: 1px solid rgba(255,255,255,0.08); }
.td-species-section-title { font-family: 'Fraunces', serif; font-size: 1.5rem; font-weight: 700; color: #eef3ec; margin-bottom: 1.5rem; }

.td-sightings-list { display: flex; flex-direction: column; gap: 0.75rem; }
.td-sighting-row {
  display: flex; align-items: center; gap: 1.5rem;
  background: #15241b; border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; padding: 0.85rem 1.25rem;
  font-size: 0.875rem;
}
.td-sighting-location { color: #eef3ec; flex: 1; }
.td-sighting-date  { color: #8fa896; }
.td-sighting-count { background: rgba(95,191,122,0.15); color: #5fbf7a; padding: 0.15rem 0.5rem; border-radius: 4px; font-weight: 600; font-size: 0.8rem; }

.td-species-related { padding: 4rem 0; background: #0a120d; border-top: 1px solid rgba(255,255,255,0.08); }
.td-species-related-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); gap: 1rem; }
.td-species-related-card { background: #15241b; border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; overflow: hidden; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s; display: block; }
.td-species-related-card:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.3); }
.td-related-card-header { padding: 0.6rem 0.8rem; background: rgba(255,255,255,0.03); }
.td-related-card-body { padding: 0.75rem 0.8rem; }
.td-related-name    { font-weight: 600; color: #eef3ec; font-size: 0.85rem; margin-bottom: 0.2rem; }
.td-related-latin   { font-size: 0.7rem; font-style: italic; color: #8fa896; margin-bottom: 0.3rem; }
.td-related-habitat { font-size: 0.7rem; color: #8fa896; }

/* -- SPECIES ARCHIVE --------------------------------------- */
.td-species-archive-filters { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; margin-bottom: 2rem; }
.td-species-search-form { display: flex; gap: 0.5rem; }
.td-species-search-input {
  padding: 0.5rem 1rem; border-radius: 8px; border: 1.5px solid rgba(255,255,255,0.12);
  background: #15241b; color: #eef3ec; font-family: 'Outfit',sans-serif; font-size: 0.875rem;
  min-width: 240px;
}
.td-species-search-input:focus { outline: none; border-color: #5fbf7a; }
.td-species-search-input::placeholder { color: #8fa896; }

.td-species-archive-count { font-size: 0.82rem; color: #8fa896; margin-bottom: 1.5rem; font-weight: 500; }

.td-species-archive-grid { grid-template-columns: repeat(auto-fill,minmax(160px,1fr)) !important; }

.td-species-pagination { display: flex; gap: 0.5rem; flex-wrap: wrap; justify-content: center; margin-top: 3rem; }
.td-species-pagination .page-numbers {
  padding: 0.5rem 0.9rem; border-radius: 8px; background: #15241b;
  border: 1px solid rgba(255,255,255,0.1); color: #8fa896; text-decoration: none; font-size: 0.875rem;
  transition: all 0.2s;
}
.td-species-pagination .page-numbers:hover { border-color: #5fbf7a; color: #5fbf7a; }
.td-species-pagination .page-numbers.current { background: #5fbf7a; color: #06140b; border-color: #5fbf7a; }

@media (max-width: 768px) {
  .td-species-hero-inner { grid-template-columns: 1fr; }
  .td2-card-hero { width: 200px; }
  .td-species-meta-grid { grid-template-columns: 1fr; }
  .td-species-archive-filters { flex-direction: column; align-items: flex-start; }
  .td-species-search-input { min-width: 100%; }
}