/* MetaGenius public theme — aligned with the landing page */
:root,
[data-theme="dark"] {
  color-scheme: dark;
  --mg-bg: #09090b;
  --mg-card: #18181b;
  --mg-card-2: #27272a;
  --mg-fg: #fafafa;
  --mg-fg-2: #a1a1aa;
  --mg-fg-3: #d4d4d8;
  --mg-border: rgba(255,255,255,.08);
  --mg-border-strong: rgba(255,255,255,.14);
  --mg-header: rgba(9,9,11,.85);
  --mg-accent: #fe6e00;
  --mg-accent-2: #ff9a3d;
  --mg-shadow: 0 20px 60px rgba(0,0,0,.35);
}
[data-theme="light"] {
  color-scheme: light;
  --mg-bg: #fafafa;
  --mg-card: #fff;
  --mg-card-2: #f4f4f5;
  --mg-fg: #09090b;
  --mg-fg-2: #71717a;
  --mg-fg-3: #3f3f46;
  --mg-border: #e4e4e7;
  --mg-border-strong: #d4d4d8;
  --mg-header: rgba(250,250,250,.84);
  --mg-accent: #e85d00;
  --mg-accent-2: #fe6e00;
  --mg-shadow: 0 18px 48px rgba(9,9,11,.08);
}
html { background: var(--mg-bg); }
html, body { min-height: 100%; }
body { background: var(--mg-bg) !important; color: var(--mg-fg-2) !important; transition: background-color .2s ease, color .2s ease; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1; background: radial-gradient(800px circle at 50% -220px, rgba(254,110,0,.09), transparent 62%); }
a { transition: color .2s ease, border-color .2s ease, background-color .2s ease, opacity .2s ease; }
h1,h2,h3,h4,h5,h6,.section-heading__title { color: var(--mg-fg) !important; }
p,.market-overview-subtitle { color: var(--mg-fg-2) !important; }
.section-bg,.market-overview,.blog-page,.blog-post,.blog-related,.premium-policy-section { background: transparent !important; }
.card,.custom--card,.market-card,.coin-card,.trade-section,.premium-sidebar,.premium-content,.blog-card,.blog-featured,.blog-related-item,.form--control,.form-control,.table-wrapper { background: var(--mg-card) !important; border-color: var(--mg-border) !important; color: var(--mg-fg) !important; box-shadow: none; }
.card:hover,.custom--card:hover,.blog-card:hover,.blog-related-item:hover { border-color: var(--mg-border-strong) !important; }
.form--control::placeholder,.form-control::placeholder { color: var(--mg-fg-2) !important; }
.table { --bs-table-bg: transparent; --bs-table-color: var(--mg-fg-2); --bs-table-border-color: var(--mg-border); color: var(--mg-fg-2) !important; }
.table thead th { color: var(--mg-fg) !important; background: var(--mg-card-2) !important; }
.btn--base,.btn-site--primary { background: var(--mg-fg) !important; border-color: var(--mg-fg) !important; color: var(--mg-bg) !important; box-shadow: none !important; }
.btn--base:hover,.btn-site--primary:hover { opacity: .86; transform: translateY(-1px); }
.text--base,.blog-post-content a,.premium-sidebar__nav a.active { color: var(--mg-accent) !important; }
.cookies-card { background: var(--mg-card) !important; color: var(--mg-fg-2) !important; border: 1px solid var(--mg-border) !important; box-shadow: var(--mg-shadow) !important; }

/* Blog theme correction: remove hard-coded forced-dark styling */
.blog-page,.blog-post,.blog-related { color: var(--mg-fg-2) !important; }
.blog-hero { background: linear-gradient(180deg, rgba(254,110,0,.07), transparent) !important; border-bottom-color: var(--mg-border) !important; text-align: center; }
.blog-hero__title,.blog-section-heading h2,.blog-featured__body h2,.blog-card__body h3,.blog-empty h3,.blog-post-title,.blog-post-content h1,.blog-post-content h2,.blog-post-content h3,.blog-post-content h4,.blog-post-content strong,.blog-related-title,.blog-related-text h3 { color: var(--mg-fg) !important; -webkit-text-fill-color: var(--mg-fg) !important; }
.blog-hero__subtitle,.blog-featured__body p,.blog-card__body p,.blog-featured__footer span,.blog-card__footer span,.blog-empty p,.blog-post-meta span,.blog-post-content,.blog-post-content p,.blog-post-content li,.blog-post-content span,.blog-related-text p { color: var(--mg-fg-2) !important; -webkit-text-fill-color: var(--mg-fg-2) !important; }
.blog-card,.blog-featured,.blog-related-item,.blog-strip { background: var(--mg-card) !important; border-color: var(--mg-border) !important; }
.blog-card__media,.blog-featured__media,.blog-related-img,.blog-image-fallback { background: var(--mg-card-2) !important; }
.blog-label,.blog-post-label,.blog-related-cat,.blog-post-tag { color: var(--mg-accent) !important; border-color: rgba(254,110,0,.22) !important; background: rgba(254,110,0,.08) !important; }
.blog-post-content blockquote { color: var(--mg-fg-2) !important; border-left-color: var(--mg-accent) !important; }
.blog-post-tags { border-top-color: var(--mg-border) !important; }

/* Legal pages */
.premium-sidebar,.premium-content { border-color: var(--mg-border) !important; background: var(--mg-card) !important; }
.premium-sidebar__header,.premium-content-header { border-color: var(--mg-border) !important; background: var(--mg-card-2) !important; }
.premium-sidebar__nav a { color: var(--mg-fg-2) !important; }
.premium-sidebar__nav a:hover { color: var(--mg-fg) !important; background: rgba(254,110,0,.06) !important; }
.premium-content-body,.premium-content-body p,.premium-content-body li { color: var(--mg-fg-2) !important; }
.premium-content-body h1,.premium-content-body h2,.premium-content-body h3,.premium-content-body h4 { color: var(--mg-fg) !important; }

/* Footer aligned to landing page */
.footer-area { background: var(--mg-bg) !important; border-top: 1px solid var(--mg-border); }
.footer-area .py-60 { padding-top: 52px !important; padding-bottom: 42px !important; }
.footer-item__logo img { max-height: 32px; width: auto; }
.footer-item__desc,.bottom-footer__text { color: var(--mg-fg-2) !important; }
.footer-item__title { color: var(--mg-fg) !important; font-size: .82rem !important; letter-spacing: .08em; text-transform: uppercase; }
.footer-menu__link { color: var(--mg-fg-2) !important; }
.footer-menu__link:hover { color: var(--mg-fg) !important; }
.bottom-footer { background: transparent !important; border-top: 1px solid var(--mg-border) !important; }
.social-list__link { background: var(--mg-card) !important; border: 1px solid var(--mg-border) !important; color: var(--mg-fg-2) !important; }
.social-list__link:hover { color: var(--mg-fg) !important; border-color: var(--mg-border-strong) !important; }

@media (max-width: 767px) {
  .footer-area .py-60 { padding-top: 38px !important; padding-bottom: 30px !important; }
  body::before { background: radial-gradient(520px circle at 50% -180px, rgba(254,110,0,.08), transparent 65%); }
}

/* Public-theme completion pass */
.blog-page { background-color: var(--mg-bg) !important; }
.blog-page .blog-hero,.blog-page .blog-container,.blog-page main,.blog-page section { color: var(--mg-fg-2); }
[data-theme="light"] .blog-page .blog-read { color: #c54d00 !important; }
[data-theme="light"] .blog-page .blog-image-fallback { color: rgba(9,9,11,.12) !important; }

.footer-area .container { max-width: 1200px; }
.footer-brand { max-width: 430px; }
.footer-item__desc { max-width: 390px; font-size: .875rem !important; line-height: 1.7 !important; margin-top: 18px !important; }
.footer-logo-light { display: none !important; }
[data-theme="light"] .footer-logo-dark { display: none !important; }
[data-theme="light"] .footer-logo-light { display: inline-block !important; }
.footer-menu { display: grid; gap: 11px; margin-top: 18px !important; }
.footer-menu__item { margin: 0 !important; }
.footer-menu__link { font-size: .875rem !important; line-height: 1.4; }
.bottom-footer__style { min-height: 58px; }
.bottom-footer__text,.bottom-footer__text a { font-size: .78rem !important; color: var(--mg-fg-2) !important; }
.social-list { gap: 8px !important; }
.social-list__link { width: 34px !important; height: 34px !important; border-radius: 8px !important; }

@media (max-width: 575px) {
  .footer-brand { max-width: none; }
  .footer-item__desc { max-width: none; }
  .bottom-footer__style > div { justify-content: center !important; text-align: center; }
}

/* ===== Blog components — SHARED by /blog index and post pages =====
   Kept here (not in index.blade.php's @push) so the post page renders the
   exact same hero, container, grid, cards, labels and back link as the index. */
.blog-page, .blog-page * { box-sizing: border-box; }
.blog-page h1, .blog-page h2, .blog-page h3, .blog-page h4 { color: var(--mg-fg) !important; margin: 0; }
.blog-page p { color: var(--mg-fg-2) !important; margin: 0; }
.blog-page span { color: var(--mg-fg-2) !important; }
.blog-page a { text-decoration: none; }
.blog-page .blog-read { color: var(--mg-accent) !important; font-weight: 600; }

.blog-hero__shell { max-width: 640px; margin: 0 auto; padding: 44px 20px 36px; }
.blog-hero__title { font-size: 1.8rem; font-weight: 700; color: var(--mg-fg) !important; margin-bottom: 8px !important; }
.blog-hero__subtitle { font-size: 0.9rem; color: var(--mg-fg-2) !important; line-height: 1.6; }

.blog-container { max-width: 1100px; margin: 0 auto; padding: 40px 20px 60px; }

.blog-page .blog-label { display: inline-flex; align-items: center; width: fit-content; padding: 5px 10px; border: 1px solid rgba(254,110,0,0.22); background: rgba(254,110,0,0.08); color: var(--mg-accent) !important; border-radius: 999px; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }

.blog-section-heading { margin-bottom: 16px; }
.blog-section-heading h2 { font-size: 1.1rem; font-weight: 700; color: var(--mg-fg) !important; }

.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.blog-card { overflow: hidden; border: 1px solid var(--mg-border); border-radius: 10px; background: var(--mg-card); transition: border-color 0.2s; }
.blog-card:hover { border-color: var(--mg-border-strong); }
.blog-card__link { display: flex; flex-direction: column; min-height: 100%; color: inherit; text-decoration: none; }
.blog-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--mg-card-2); }
.blog-card__media img { width: 100%; height: 100%; object-fit: cover; }
.blog-card__media .blog-label { position: absolute; left: 10px; top: 10px; background: color-mix(in srgb, var(--mg-card) 88%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.blog-card__body { padding: 18px; display: flex; flex-direction: column; flex: 1; }
.blog-card__body h3 { font-size: 0.95rem; font-weight: 700; margin-bottom: 6px; line-height: 1.35; color: var(--mg-fg) !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blog-card__body p { font-size: 0.8rem; line-height: 1.55; color: var(--mg-fg-2) !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blog-featured__footer, .blog-card__footer { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; }
.blog-featured__footer span, .blog-card__footer span { display: inline-flex; align-items: center; gap: 5px; color: var(--mg-fg-2) !important; font-size: 0.75rem; font-weight: 600; }
.blog-card__footer { margin-top: auto; padding-top: 14px; }

.blog-image-fallback { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 200px; background: var(--mg-card-2); color: rgba(255,255,255,0.08); font-size: 2.5rem; }
.blog-image-fallback span { display: none; }
.blog-image-fallback--featured { min-height: 320px; font-size: 3.5rem; }

.blog-pagination { display: flex; justify-content: center; margin-top: 40px; }
.blog-back { display: inline-flex; align-items: center; gap: 8px; color: var(--mg-accent) !important; font-weight: 600; font-size: 0.85rem; text-decoration: none; }
.blog-back:hover { color: var(--mg-accent-2) !important; }

.blog-page { background: var(--mg-bg) !important; min-height: 100vh; }

@media (max-width: 768px) {
  .blog-hero__shell { padding: 32px 16px 28px; }
  .blog-hero__title { font-size: 1.4rem; }
  .blog-hero__subtitle { font-size: 0.82rem; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-container { padding: 28px 16px 44px; }
}
