/* Final page unification layer.
   Loaded after all page-specific CSS to keep AnalystMarkets visually consistent. */

:root {
  --am-u-max: 1320px;
  --am-u-reading-max: 920px;
  --am-u-gutter: clamp(0.9rem, 2.2vw, 1.5rem);
  --am-u-gap: clamp(1rem, 2vw, 1.5rem);
  --am-u-radius: 14px;
  --am-u-radius-sm: 10px;
  --am-u-line: var(--am-line, rgba(148, 163, 184, 0.16));
  --am-u-line-strong: var(--am-line-strong, rgba(34, 211, 238, 0.28));
  --am-u-text: var(--am-text-strong, var(--text-primary, #eef6ff));
  --am-u-body: var(--am-text-body, var(--text-secondary, #b7c4d4));
  --am-u-muted: var(--am-text-soft, var(--text-muted, #8b9aab));
  --am-u-accent: var(--am-accent, #22d3ee);
  --am-u-accent-strong: var(--am-accent-hover, #67e8f9);
  --am-u-panel:
    linear-gradient(135deg, rgba(34, 211, 238, 0.1), transparent 46%),
    linear-gradient(145deg, rgba(12, 19, 29, 0.9), rgba(8, 14, 24, 0.76));
  --am-u-card:
    linear-gradient(145deg, rgba(13, 21, 32, 0.86), rgba(8, 14, 24, 0.7));
  --am-u-shadow: 0 14px 38px rgba(0, 0, 0, 0.22);
}

[data-theme="light"] {
  --am-u-line: rgba(54, 56, 50, 0.24);
  --am-u-line-strong: rgba(47, 117, 168, 0.42);
  --am-u-text: #1e1f1b;
  --am-u-body: #363832;
  --am-u-muted: #5d605a;
  --am-u-accent: #2f75a8;
  --am-u-accent-strong: #245b83;
  --am-u-panel:
    linear-gradient(135deg, rgba(47, 117, 168, 0.1), rgba(38, 160, 111, 0.045) 48%, transparent),
    linear-gradient(145deg, #ffffff, #f4f7f8);
  --am-u-card:
    linear-gradient(145deg, #ffffff, #f7f8f7);
  --am-u-shadow: 0 12px 32px rgba(54, 56, 50, 0.1);
}

body[class^="page-"],
body[class*=" page-"] {
  background:
    radial-gradient(circle at 12% -12%, color-mix(in srgb, var(--am-u-accent) 12%, transparent), transparent 28rem),
    radial-gradient(circle at 90% 0%, color-mix(in srgb, #26a06f 8%, transparent), transparent 28rem),
    var(--bg-surface, #070b12) !important;
  color: var(--am-u-body) !important;
}

[data-theme="light"] body[class^="page-"],
[data-theme="light"] body[class*=" page-"] {
  background:
    radial-gradient(circle at 12% -12%, rgba(47, 117, 168, 0.1), transparent 28rem),
    radial-gradient(circle at 90% 0%, rgba(38, 160, 111, 0.07), transparent 28rem),
    linear-gradient(180deg, #fbfbfa 0%, #f4f4f2 52%, #eeeeec 100%) !important;
}

body[class^="page-"] .main-content,
body[class*=" page-"] .main-content {
  overflow-x: hidden;
}

body[class^="page-"] .main-content > .container,
body[class*=" page-"] .main-content > .container {
  width: min(100%, var(--am-u-max)) !important;
  max-width: var(--am-u-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--am-u-gutter) !important;
  padding-bottom: clamp(2.5rem, 5vw, 4rem) !important;
}

body[class^="page-"] .main-content :is(h1, h2, h3),
body[class*=" page-"] .main-content :is(h1, h2, h3) {
  color: var(--am-u-text) !important;
  letter-spacing: 0 !important;
}

body[class^="page-"] .main-content p,
body[class*=" page-"] .main-content p {
  color: inherit;
}

.skip-link {
  background: #245b83 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Same hero language across standalone pages. */
:is(
  .am-page-hero,
  .search-hero,
  .cmp-hero,
  .embed-hero,
  .acc-hero,
  .bm-hero,
  .war-hero,
  .guide-hero,
  .hero-section,
  .vol-page-header,
  .lb-hero,
  .dr-header,
  .symbol-header,
  .symbol-command-panel,
  .page-pricing .main-content > .container > div > div[style*="text-align: center"],
  .page-contact .main-content > .container > div > div[style*="margin-bottom: 3rem"]:not([style*="grid"]),
  .page-api_docs .main-content > .container > div > div[style*="margin-bottom: 3rem"],
  .page-backtest_history .main-content > .container > section:first-child,
  .page-symbol_accuracy_detail .main-content > .container > section:first-child
) {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: var(--am-u-max) !important;
  margin-inline: auto !important;
  margin-bottom: var(--am-u-gap) !important;
  padding: clamp(1.35rem, 3vw, 2.35rem) !important;
  border: 1px solid var(--am-u-line-strong) !important;
  border-radius: var(--am-u-radius) !important;
  background: var(--am-u-panel) !important;
  box-shadow: var(--am-u-shadow) !important;
  color: var(--am-u-body) !important;
}

:is(
  .am-page-hero,
  .search-hero,
  .cmp-hero,
  .embed-hero,
  .acc-hero,
  .bm-hero,
  .war-hero,
  .guide-hero,
  .hero-section,
  .vol-page-header,
  .lb-hero,
  .dr-header,
  .symbol-header,
  .symbol-command-panel
)::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(rgba(148, 163, 184, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, 0.045) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.78), transparent 78%) !important;
}

:is(
  .am-page-hero,
  .search-hero,
  .cmp-hero,
  .embed-hero,
  .acc-hero,
  .bm-hero,
  .war-hero,
  .guide-hero,
  .hero-section,
  .vol-page-header,
  .lb-hero,
  .dr-header,
  .symbol-header,
  .symbol-command-panel
) > * {
  position: relative !important;
  z-index: 1 !important;
}

:is(
  .am-page-title,
  .search-title,
  .cmp-title,
  .cmp-pair-title,
  .embed-hero h1,
  .war-hero__title,
  .lb-hero__title,
  .dr-header-title h1,
  .vol-page-header h1,
  .guide-hero h1,
  .hero-section h1
) {
  max-width: 18ch !important;
  margin: 0 !important;
  color: var(--am-u-text) !important;
  font-size: clamp(1.85rem, 4vw, 3rem) !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  -webkit-text-fill-color: currentColor !important;
}

:is(
  .am-page-subtitle,
  .search-subtitle,
  .cmp-sub,
  .embed-hero p,
  .war-hero__sub,
  .lb-hero__desc,
  .vol-page-header p,
  .guide-hero p,
  .hero-section p
) {
  max-width: 68ch !important;
  color: var(--am-u-body) !important;
  font-size: clamp(0.95rem, 1.4vw, 1.08rem) !important;
  line-height: 1.7 !important;
}

:is(.am-kicker, .search-kicker, .cmp-kicker, .embed-hero__kicker, .lb-hero__eyebrow, .war-hero__eyebrow, .hero-badge, .vol-breadcrumb, .acc-hero__symbol) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
  width: fit-content !important;
  margin-bottom: 0.8rem !important;
  padding: 0.34rem 0.7rem !important;
  border: 1px solid color-mix(in srgb, var(--am-u-accent) 28%, transparent) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--am-u-accent) 11%, transparent) !important;
  color: var(--am-u-accent-strong) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

/* One card/surface language, regardless of the source page CSS. */
:is(
  .am-glass-card,
  .search-result-card,
  .search-empty-state,
  .search-suggestion-panel,
  .cmp-form,
  .cmp-pair,
  .cmp-col,
  .cmp-verdict,
  .cmp-pred,
  .cmp-explainer,
  .embed-form,
  .embed-preview,
  .embed-code,
  .embed-instructions,
  .embed-snippet,
  .acc-table-wrap,
  .acc-row,
  .acc-tf,
  .acc-cta,
  .acc-chip,
  .bm-card,
  .bm-tier,
  .bm-lead,
  .war-stat-card,
  .war-prov-card,
  .war-table-wrap,
  .war-asset-card,
  .war-empty,
  .war-method,
  .dr-card,
  .dr-index-card,
  .dr-movers-panel,
  .dr-subscribe,
  .vol-card,
  .vol-stats-strip,
  .vol-table-wrap,
  .news-card,
  .filter-bar,
  .accordion-item,
  .glossary-section,
  .content-section,
  .glass-card,
  .ai-card,
  .why-card,
  .platform-social-card,
  .feature-card,
  .pricing-card,
  .card,
  .market-summary-card,
  .chart-container,
  .dashboard-container,
  .tab-nav-container,
  .brand-command-panel,
  .home-top-bar,
  .quick-symbols-strip,
  .page-pricing div[style*="background: var(--card-bg)"],
  .page-pricing div[style*="background: var(--bg-secondary)"],
  .page-contact div[style*="background: var(--card-bg)"],
  .page-contact div[style*="background: var(--bg-secondary)"],
  .page-api_docs div[style*="background: var(--card-bg)"],
  .page-api_docs div[style*="background: var(--bg-secondary)"],
  .page-api_docs section[style*="background"],
  .page-terms .main-content [style*="background"],
  .page-privacy .main-content [style*="background"],
  .page-account_login .main-content [style*="background"],
  .page-account_signup .main-content [style*="background"],
  .page-account_reset_password .main-content [style*="background"],
  .page-api_keys .main-content [style*="background"],
  .page-backtest_history .stat-card,
  .page-backtest_history form[method="get"],
  .page-backtest_history div[style*="overflow-x: auto"],
  .page-backtest_history ul[style*="list-style: none"]
) {
  border: 1px solid var(--am-u-line) !important;
  border-radius: var(--am-u-radius) !important;
  background: var(--am-u-card) !important;
  box-shadow: var(--am-u-shadow) !important;
  color: var(--am-u-body) !important;
}

:is(
  .search-result-card,
  .cmp-pair,
  .news-card,
  .dr-index-card,
  .dr-movers-panel,
  .vol-card,
  .market-summary-card,
  .quick-action-card,
  .platform-social-card,
  .feature-card
) {
  transition:
    transform 0.18s var(--am-ease-out, ease),
    border-color 0.18s var(--am-ease-out, ease),
    box-shadow 0.18s var(--am-ease-out, ease) !important;
}

:is(
  .search-result-card,
  .cmp-pair,
  .news-card,
  .dr-index-card,
  .dr-movers-panel,
  .vol-card,
  .market-summary-card,
  .quick-action-card,
  .platform-social-card,
  .feature-card
):hover {
  border-color: var(--am-u-line-strong) !important;
  box-shadow: var(--am-shadow-lift, var(--am-u-shadow)) !important;
  transform: translateY(-2px) !important;
}

/* Consistent controls. */
:is(input, select, textarea, .search-input-modern, .search-input, .cmp-form input, .filter-select, .filter-select-inline) {
  min-height: 44px !important;
  border: 1px solid var(--am-u-line) !important;
  border-radius: var(--am-u-radius-sm) !important;
  background: color-mix(in srgb, var(--bg-card, #0d1520) 86%, transparent) !important;
  color: var(--am-u-text) !important;
  box-shadow: none !important;
}

:is(input, select, textarea, .search-input-modern, .search-input, .cmp-form input, .filter-select, .filter-select-inline)::placeholder {
  color: var(--am-u-muted) !important;
  opacity: 1 !important;
}

:is(
  button[type="submit"],
  .search-submit-modern,
  .am-action-btn,
  .brand-primary-action,
  .cta-primary,
  .cta-button,
  .btn-primary-hero,
  .copy-btn,
  .cmp-form button,
  .filter-chip.active,
  .vol-tab-btn.active,
  .war-btn--primary,
  .platform-social-btn,
  .am-auth-btn-primary,
  .am-hero__btn--primary
) {
  min-height: 42px !important;
  border: 1px solid transparent !important;
  border-radius: var(--am-u-radius-sm) !important;
  background-color: #245b83 !important;
  background-image: var(--am-brand-gradient, linear-gradient(135deg, #245b83, #2f75a8 58%, #08753f)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 800 !important;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--am-u-accent) 22%, transparent) !important;
}

:is(
  .brand-secondary-action,
  .tour-btn-secondary,
  .filter-chip,
  .search-chip,
  .news-symbol-chip,
  .quick-symbol-chip,
  .vol-tab-btn,
  .war-btn--ghost,
  .bm-btn--ghost
) {
  border: 1px solid var(--am-u-line) !important;
  border-radius: var(--am-u-radius-sm) !important;
  background: color-mix(in srgb, var(--bg-card, #0d1520) 76%, transparent) !important;
  color: var(--am-u-text) !important;
}

.page-home .quick-symbol-chip.crypto {
  color: #806208 !important;
  border-color: rgba(128, 98, 8, 0.3) !important;
}

[data-theme="dark"] .page-home .quick-symbol-chip.crypto {
  color: #ffe380 !important;
  border-color: rgba(255, 227, 128, 0.22) !important;
}

.page-home .tab-nav-item.active,
.page-home .quick-filter-chip.active,
.page-news .filter-chip.active,
.page-crypto_volume .vol-tab-btn.active {
  background-color: #245b83 !important;
  background-image: linear-gradient(135deg, #245b83, #2f75a8) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.page-home .tab-nav-item.active .tab-label,
.page-home .quick-filter-chip.active span,
.page-news .filter-chip.active,
.page-crypto_volume .vol-tab-btn.active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.page-compare .cmp-pair .vs,
.page-compare .cmp-pair-title .vs {
  color: #8fc1e8 !important;
}

[data-theme="light"] .page-compare .cmp-pair .vs,
[data-theme="light"] .page-compare .cmp-pair-title .vs {
  color: #245b83 !important;
}

.page-symbol_detail .back-button {
  color: #8fc1e8 !important;
  -webkit-text-fill-color: #8fc1e8 !important;
}

[data-theme="light"] .page-symbol_detail .back-button {
  color: #245b83 !important;
  -webkit-text-fill-color: #245b83 !important;
}

.main-content :is(label, .form-label, .input-label) {
  color: var(--am-u-body) !important;
}

[data-theme="light"] .main-content :is(label, .form-label, .input-label) {
  color: #363832 !important;
}

.avatar-text {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

:is(table, .leaderboard-table, .acc-table, .war-table) {
  border-color: var(--am-u-line) !important;
}

:is(th, .acc-table th, .war-table th) {
  color: var(--am-u-muted) !important;
  background: color-mix(in srgb, var(--bg-secondary, #0c131d) 76%, transparent) !important;
}

:is(td, .acc-table td, .war-table td) {
  color: var(--am-u-body) !important;
  border-color: var(--am-u-line) !important;
}

/* Keep legal/text-heavy pages from feeling like a different product. */
:is(.page-terms, .page-privacy, .page-blog_detail) .main-content > .container > div {
  max-width: var(--am-u-reading-max) !important;
  margin-inline: auto !important;
  padding: clamp(1.25rem, 3vw, 2rem) !important;
  border: 1px solid var(--am-u-line) !important;
  border-radius: var(--am-u-radius) !important;
  background: var(--am-u-card) !important;
  box-shadow: var(--am-u-shadow) !important;
}

:is(.page-terms, .page-privacy, .page-blog_detail) .main-content > .container > div :is(p, li) {
  color: var(--am-u-body) !important;
}

@media (max-width: 760px) {
  body[class^="page-"] .main-content > .container,
  body[class*=" page-"] .main-content > .container {
    padding-inline: 0.85rem !important;
  }

  :is(
    .am-page-hero,
    .search-hero,
    .cmp-hero,
    .embed-hero,
    .acc-hero,
    .bm-hero,
    .war-hero,
    .guide-hero,
    .hero-section,
    .vol-page-header,
    .lb-hero,
    .dr-header,
    .symbol-header,
    .symbol-command-panel
  ) {
    padding: 1.2rem !important;
    border-radius: 14px !important;
  }

  :is(
    .am-page-title,
    .search-title,
    .cmp-title,
    .cmp-pair-title,
    .embed-hero h1,
    .war-hero__title,
    .lb-hero__title,
    .dr-header-title h1,
    .vol-page-header h1,
    .guide-hero h1,
    .hero-section h1
  ) {
    max-width: 100% !important;
    font-size: clamp(1.65rem, 8vw, 2.2rem) !important;
  }

  :is(.search-command, .cmp-form) {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
  }

  :is(.search-submit-modern, .cmp-form button) {
    width: 100% !important;
  }
}

body a.skip-link,
body a.skip-link:link,
body a.skip-link:visited,
body a.skip-link:hover,
body a.skip-link:focus {
  background: #245b83 !important;
  background-color: #245b83 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] body.page-home a.quick-symbol-chip.crypto,
html[data-theme="light"] body.page-home .quick-symbols-list a.quick-symbol-chip.crypto {
  color: #554105 !important;
  -webkit-text-fill-color: #554105 !important;
  border-color: rgba(85, 65, 5, 0.34) !important;
}

body.page-global_search button.search-submit-modern,
body.page-global_search .search-submit-modern,
body.page-about a.cta-primary,
body.page-about .cta-btn.cta-primary,
body.page-home .am-hero__btn.am-hero__btn--primary,
body.page-home .tab-nav-item.active,
body.page-home .quick-filter-chip.active,
body.page-news .filter-chip.active,
body.page-crypto_volume .vol-tab-btn.active,
body.page-compare button[type="submit"],
body.page-embed_generator .copy-btn,
body.page-contact button[type="submit"] {
  background-color: #245b83 !important;
  background-image: linear-gradient(135deg, #245b83, #2f75a8 58%, #08753f) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.page-home .tab-nav-item.active :is(span, .tab-label),
body.page-home .quick-filter-chip.active :is(span, .tab-label),
body.page-global_search button.search-submit-modern :is(span, svg),
body.page-about a.cta-primary :is(span, svg),
body.page-about .cta-btn.cta-primary :is(span, svg) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] body[class^="page-"] .main-content :is(
  button[type="submit"],
  .search-submit-modern,
  .brand-primary-action,
  .cta-primary,
  .cta-button,
  .btn-primary-hero,
  .copy-btn,
  .cmp-form button,
  .filter-chip.active,
  .vol-tab-btn.active,
  .war-btn--primary,
  .platform-social-btn,
  .advanced-filters-toggle,
  .cockpit-action-primary,
  .step-action,
  .am-hero__btn--primary
) {
  background: linear-gradient(135deg, #245b83, #2f75a8 58%, #08753f) #245b83 !important;
  border-color: transparent !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] body[class^="page-"] .main-content :is(
  button[type="submit"],
  .search-submit-modern,
  .brand-primary-action,
  .cta-primary,
  .cta-button,
  .btn-primary-hero,
  .copy-btn,
  .cmp-form button,
  .filter-chip.active,
  .vol-tab-btn.active,
  .war-btn--primary,
  .platform-social-btn,
  .advanced-filters-toggle,
  .cockpit-action-primary,
  .step-action,
  .am-hero__btn--primary
) :is(span, svg, i) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] body.page-about .creator-avatar .avatar-text {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  background: #245b83 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="light"] .breadcrumb a {
  color: #245b83 !important;
}

html[data-theme="light"] body.page-global_search .search-result-card--symbol .search-symbol-code {
  color: #245b83 !important;
  -webkit-text-fill-color: #245b83 !important;
}

html[data-theme="light"] body.page-global_search .search-result-card--symbol[style] > span:last-child {
  border: 1px solid rgba(36, 91, 131, 0.24) !important;
  background: #eef6ff !important;
  color: #245b83 !important;
  -webkit-text-fill-color: #245b83 !important;
}

body.page-api_docs pre {
  max-width: 100% !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

html[data-theme="dark"] body.page-account_signup :is(.helptext, .form-text, small, p, span) {
  color: #9bb4d0 !important;
}

@media (min-width: 1080px) {
  .dashboard-header {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
  }

  .dashboard-header .header-left {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: var(--space-sm, 0.5rem) !important;
    min-width: 0 !important;
  }

  .dashboard-header .header-brand {
    max-width: min(100%, 860px) !important;
  }

  .dashboard-header .brand-info,
  .dashboard-header .header-brand {
    min-width: 0 !important;
  }

  .dashboard-header .brand-title {
    max-width: min(100%, 860px) !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
  }

  .dashboard-header .brand-subtitle {
    max-width: min(100%, 840px) !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
  }

  .dashboard-header .header-nav {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: min(100%, 860px) !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-width: none;
  }

  .dashboard-header .header-nav::-webkit-scrollbar {
    display: none;
  }

  .dashboard-header .header-nav .nav-link,
  .dashboard-header .header-nav .dropdown-toggle {
    flex: 0 0 auto !important;
  }

  .dashboard-header .header-actions {
    align-self: flex-start !important;
    margin-top: 0.2rem !important;
  }
}

@media (min-width: 1080px) and (max-width: 1280px) {
  .dashboard-header .brand-title {
    max-width: min(100%, 720px) !important;
  }

  .dashboard-header .brand-subtitle,
  .dashboard-header .header-nav {
    max-width: min(100%, 760px) !important;
  }
}

@media (min-width: 768px) and (max-width: 1240px) {
  .dashboard-header .brand-subtitle {
    display: block !important;
  }
}
