/*
 * Final visual compatibility layer.
 * Loaded after page styles so legacy Aurora declarations resolve to one
 * restrained green/antracite interface without changing test mechanics.
 */

:root {
  --accent: var(--dn-green);
  --accent-hover: var(--dn-green-hover);
  --bg: var(--dn-page);
  --bg-soft: var(--dn-page-raised);
  --card: var(--dn-surface);
  --surface: var(--dn-surface);
  --surface-2: var(--dn-surface-raised);
  --border: var(--dn-border-color);
  --text: var(--dn-text-primary);
  --text-muted: var(--dn-text-secondary);
  --muted: var(--dn-text-secondary);
  --ring: var(--dn-focus-ring);
  --shadow-sm: var(--dn-shadow-sm);
  --shadow-md: var(--dn-shadow-md);
  --shadow-lg: var(--dn-shadow-lg);
  --dn-text-1: var(--dn-text-primary);
  --dn-text-2: var(--dn-text-secondary);
  --dn-text-3: var(--dn-text-faded);
  --dn-text-4: var(--dn-text-faded);
  --dn-link: #69d9bd;
}

body {
  background-color: var(--dn-page) !important;
  background-image: none !important;
}

main,
.home-section,
.dn-home,
.dt-app-page,
.dd-page,
.test-page,
.kamera-page,
.kbtest-page,
.mic-page,
.monitor-page,
.mouse-page,
.hop-test-page {
  color: var(--dn-text-primary);
}

/* Shared surfaces */
.glass-panel,
.glass-card,
.dn-glass,
.dn-surface,
.soft-card,
.custom-cardback,
.test-card,
.camera-intro-card,
.camera-app-shell,
.kb-card,
.mic-card,
.monitor-card,
.mouse-card,
.simulasyon-card {
  border: 1px solid var(--dn-border-color) !important;
  background-color: var(--dn-surface) !important;
  background-image: none !important;
  color: var(--dn-text-primary) !important;
  box-shadow: var(--dn-shadow-sm) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.glass-panel:hover,
.glass-card:hover,
.test-card:hover {
  border-color: #555 !important;
}

.section-title,
.test-title,
.monitor-title,
.mic-title,
.mouse-title {
  color: var(--dn-text-primary) !important;
}

.section-sub,
.test-subtle,
.test-status,
.monitor-sub,
.monitor-help,
.monitor-muted,
.mic-sub,
.mic-help,
.mouse-sub {
  color: var(--dn-text-secondary) !important;
}

/* Breadcrumb and language switcher */
.dn-crumb,
.app-breadcrumb,
.dm-breadcrumb-shell {
  border: 1px solid var(--dn-border-muted) !important;
  border-radius: 10px !important;
  background: var(--dn-page-raised) !important;
  color: var(--dn-text-secondary) !important;
  box-shadow: none !important;
}

.dn-crumb a,
.app-breadcrumb a,
.dm-breadcrumb-shell a {
  color: var(--dn-text-secondary) !important;
}

.dn-crumb a:hover,
.app-breadcrumb a:hover,
.dm-breadcrumb-shell a:hover {
  color: #7dddc5 !important;
}

.dn-language-select,
.dn-language-select select,
.language-select,
.language-select select {
  border-color: var(--dn-border-color) !important;
  background-color: var(--dn-page-raised) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
}

/* Header and footer are deliberately flat: no glass or Aurora glow. */
.navbar-wrapper .app-navbar {
  background: var(--dn-sidebar) !important;
}

.site-footer {
  margin-top: 56px;
  padding: 0 0 20px;
  border-top: 1px solid var(--dn-border-muted);
  background: var(--dn-sidebar);
}

.site-footer .container {
  max-width: 1280px;
}

.site-footer .footer-inner {
  padding: 32px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
}

.site-footer .footer-brand-line {
  width: 54px;
  height: 3px;
  margin: 0 0 26px;
  border-radius: 999px;
  background: var(--dn-green);
}

.site-footer .footer-top-grid {
  grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.site-footer .footer-brand-area,
.site-footer .footer-link-card {
  padding: 20px;
  border: 1px solid var(--dn-border-muted);
  border-radius: 14px;
  background: var(--dn-page-raised) !important;
  box-shadow: none;
}

.site-footer .footer-link-card:hover {
  border-color: var(--dn-border-color);
  background: var(--dn-surface) !important;
  transform: none;
}

.site-footer .footer-socials a,
.site-footer .footer-platforms span,
.site-footer .footer-info-item,
.site-footer .footer-affiliate {
  background: var(--dn-surface) !important;
}

.site-footer .footer-contact-button {
  border-radius: 9px;
  background: var(--dn-green-soft) !important;
}

/* Home */
.dn-home {
  overflow: clip;
  padding-bottom: 8px;
}

.dn-home-hero-shell,
.dn-stats-panel,
.dn-final-cta-shell,
.dn-eco-roof-shell {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 18px !important;
  background: var(--dn-page-raised) !important;
  box-shadow: var(--dn-shadow-sm) !important;
}

.dn-home-hero-shell {
  min-height: 0 !important;
  padding: clamp(24px, 4vw, 38px) !important;
}

.dn-home-hero-grid {
  gap: clamp(24px, 4vw, 42px) !important;
}

.dn-home-title {
  max-width: 720px;
  font-size: clamp(2.15rem, 5vw, 4.1rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
}

.dn-home-title span,
.dd-gradient-text,
.dt-gradient-text,
.dn-pro-gradient-text {
  background: none !important;
  color: var(--dn-green) !important;
  -webkit-text-fill-color: currentColor !important;
  filter: none !important;
  animation: none !important;
}

.dn-home-subtitle {
  color: var(--dn-text-secondary) !important;
}

.dn-home-pill,
.dn-section-kicker,
.dn-web-test-pill,
.dn-eco-roof-platform {
  border-color: var(--dn-border-color) !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-secondary) !important;
  box-shadow: none !important;
}

.dn-home-pill:first-child,
.dn-section-kicker {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-green-soft) !important;
  color: #d8fff5 !important;
}

.dn-home-main-btn,
.dn-home-ghost-btn,
.dn-final-actions .btn {
  border-radius: 9px !important;
}

.dn-home-hero-stage {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-height: 0 !important;
}

.dn-device-card {
  position: relative !important;
  inset: auto !important;
  width: auto !important;
  min-height: 148px !important;
  padding: 16px !important;
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 14px !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  animation: none !important;
}

.dn-device-card-web {
  grid-column: 1 / -1;
}

.dn-device-card:hover {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-surface-raised) !important;
  transform: translateY(-2px) !important;
}

.dn-home-orb,
.dn-stats-glow,
.dn-eco-roof-orb,
.dn-eco-roof-lines {
  display: none !important;
}

.dn-ecosystem-grid,
.dn-test-grid,
.dn-eco-roof-grid {
  gap: 12px !important;
}

.dn-ecosystem-card,
.dn-test-card,
.dn-stat-card,
.dn-eco-roof-card,
.dn-eco-roof-hub {
  min-height: 0;
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 14px !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.dn-ecosystem-card::before,
.dn-test-card::before,
.dn-stat-card::before,
.dn-eco-roof-card::before {
  display: none !important;
}

.dn-ecosystem-card:hover,
.dn-test-card:hover,
.dn-stat-card:hover,
.dn-eco-roof-card:hover,
.dn-eco-roof-card-featured:hover {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-surface-raised) !important;
  transform: translateY(-2px) !important;
}

.dn-ecosystem-icon,
.dn-test-icon,
.dn-stat-icon,
.dn-eco-roof-card-icon,
.dn-eco-roof-hub-logo {
  border-color: var(--dn-border-color) !important;
  border-radius: 12px !important;
  background: var(--dn-page-raised) !important;
  color: var(--dn-green) !important;
  box-shadow: none !important;
}

.dn-eco-roof-shell {
  padding: clamp(20px, 3vw, 30px) !important;
}

.dn-eco-roof-visual {
  min-height: 0 !important;
  padding-top: 0 !important;
}

.dn-eco-roof-hub {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  min-height: 0 !important;
  margin-bottom: 14px;
  transform: none !important;
}

.dn-eco-roof-hub-ring {
  display: none;
}

.dn-eco-roof-card-featured {
  transform: none !important;
}

.dn-stats-strip {
  border-radius: 10px !important;
  background: var(--dn-surface) !important;
}

.dn-stats-strip span {
  animation: none !important;
}

/* Test pages */
.test-page,
.kamera-page,
.kbtest-page,
.mic-page,
.monitor-page,
.mouse-page,
.hop-test-page,
.simulasyon-klavye-page,
.simulasyon-mikrofon-page {
  padding-top: 10px;
  padding-bottom: 30px;
}

.camera-intro-card {
  padding: clamp(20px, 3vw, 30px) !important;
  border-radius: 16px !important;
}

.camera-intro-card::before,
.camera-intro-card::after,
.dn-glass::before,
.dn-glass::after,
.dn-hero::before,
.dn-hero-app-card::before,
.kb-app-download-card::before,
.kb-app-download-card::after,
.kb-side-banner__link::before,
.mic-voice-banner__glow {
  display: none !important;
}

.camera-intro-badge,
.camera-intro-badges span,
.dn-pill,
.mic-info-chip,
.mic-voice-banner__chip {
  border-color: var(--dn-border-color) !important;
  background: var(--dn-page-raised) !important;
  color: var(--dn-text-secondary) !important;
  box-shadow: none !important;
}

.camera-intro-badges i,
.dn-pill i {
  color: var(--dn-green) !important;
}

.test-page .test-tile,
.gp-sim .gp-panel,
.gp-sim .gp-triggers,
.gp-sim .gp-buttons,
.kb-test-controls,
.kb-premium-box,
.kb-mini-info__item,
.kb-step-card,
.kb-faq-item,
.mouse-seo-box,
.mouse-faq-box,
.mic-panel,
.mic-stat,
.mic-step-card,
.mic-faq-item,
.mon-seo-card,
.spk-card,
.spk-panel {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 12px !important;
  background: var(--dn-page-raised) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
}

.test-page .test-tile:hover,
.kb-step-card:hover,
.kb-faq-item:hover {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-hover) !important;
  transform: translateY(-2px);
}

.kb-app-download-card,
.kb-side-banner__link,
.mic-voice-banner {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 14px !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
}

.kb-app-download-card:hover,
.kb-side-banner__link:hover {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-surface-raised) !important;
  transform: translateY(-2px) !important;
}

.kb-app-download-icon,
.kb-app-download-action,
.kb-side-banner__badge,
.mic-voice-banner__badge,
.mic-voice-card__btn {
  border-color: var(--dn-green-border) !important;
  background: var(--dn-green-soft) !important;
  color: #d8fff5 !important;
  box-shadow: none !important;
}

.kb-test-btn,
.mic-btn,
.spk-btn {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 9px !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
}

.kb-test-btn:hover,
.mic-btn:hover,
.spk-btn:hover {
  background: var(--dn-hover) !important;
}

.kb-test-btn.active,
.kb-test-btn.btn-premium-copy,
.mic-btn--primary,
.mic-btn--accent,
.spk-btn.is-active {
  border-color: var(--dn-green) !important;
  background: var(--dn-green) !important;
  color: #fff !important;
}

.trq-board,
.trq-panel,
.keyboard-shell {
  border-color: var(--dn-border-color) !important;
  background-color: var(--dn-page-raised) !important;
  box-shadow: none !important;
}

.trq-key {
  border-color: #4a4a4a !important;
  background-color: #282828 !important;
  color: var(--dn-text-secondary) !important;
}

.trq-key.pressed,
.trq-key.active,
.trq-key.is-pressed {
  border-color: var(--dn-green) !important;
  background: var(--dn-green) !important;
  color: #fff !important;
  box-shadow: 0 0 0 3px var(--dn-green-soft) !important;
}

.mouse-shape,
.mouse-button {
  border-color: var(--dn-border-color) !important;
  background-color: #292929 !important;
}

.mouse-button.active,
.mouse-button.pressed {
  border-color: var(--dn-green) !important;
  background-color: var(--dn-green) !important;
}

.mic-meter,
.mic-visual-wrap,
.mic-viz-wrap,
.monitor-controls {
  border-color: var(--dn-border-color) !important;
  background-color: var(--dn-page-raised) !important;
}

/* App and desktop landing pages */
.dt-app-page::before,
.dt-hero::before,
.dt-phone-glow,
.dt-otg-orbit,
.dd-page::before,
.dd-hero::before,
.dd-stage-glow {
  display: none !important;
}

.dt-glass,
.dt-glass-soft,
.dd-glass,
.dd-glass-soft {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 16px !important;
  background: var(--dn-page-raised) !important;
  box-shadow: var(--dn-shadow-sm) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.dt-hero,
.dd-hero {
  min-height: 0 !important;
}

.dt-feature-card,
.dt-benefit-card,
.dt-step-card,
.dt-screen-card,
.dt-faq-item,
.dd-feature-card,
.dd-benefit-card,
.dd-step-card,
.dd-screen-card,
.dd-requirement-card,
.dd-faq-item {
  border: 1px solid var(--dn-border-color) !important;
  border-radius: 12px !important;
  background: var(--dn-surface) !important;
  box-shadow: none !important;
}

.dt-btn,
.dd-btn {
  min-height: 46px;
  border-radius: 9px !important;
  box-shadow: none !important;
}

.dt-btn-primary,
.dd-btn-primary {
  border-color: var(--dn-green) !important;
  background: var(--dn-green) !important;
  color: #fff !important;
}

.dt-btn-primary:hover,
.dd-btn-primary:hover {
  border-color: var(--dn-green-hover) !important;
  background: var(--dn-green-hover) !important;
  filter: none !important;
}

.dt-btn-ghost,
.dd-btn-ghost {
  border-color: var(--dn-border-color) !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
}

/* Product, blog, account and update pages */
.urun-detay-page .card,
.compare-page .card,
.compare-demo-card,
.blog-page-wrap,
.blog-card,
.rv-card,
.rv-panel,
.ku-panel,
.ku-card,
.update-hero,
.update-stat,
.update-card,
.update-item,
.meeting-hero,
.meeting-card,
.meeting-stage {
  border-color: var(--dn-border-color) !important;
  background-color: var(--dn-surface) !important;
  background-image: none !important;
  color: var(--dn-text-primary) !important;
  box-shadow: var(--dn-shadow-sm) !important;
  backdrop-filter: none !important;
}

.urun-detay-page .card:hover,
.blog-card:hover,
.update-card:hover,
.update-item:hover {
  border-color: var(--dn-green-border) !important;
}

.compare-page .compare-grid__row:nth-child(odd):not(.compare-grid__row--head) {
  background: #292929 !important;
}

.compare-page .compare-grid__row:hover:not(.compare-grid__row--head) {
  background: var(--dn-hover) !important;
}

.kb-affiliate-card {
  --kb-affiliate-accent: var(--dn-green) !important;
  --kb-affiliate-accent-strong: var(--dn-green-hover) !important;
  --kb-affiliate-surface: var(--dn-page-raised) !important;
}

/* Denerim Pro keeps its hierarchy but joins the same restrained palette. */
.dn-pro-page {
  --pro-orange: var(--dn-green);
  --pro-orange-2: var(--dn-green-hover);
  --pro-violet: var(--dn-green);
  --pro-blue: var(--dn-green);
  --pro-cyan: var(--dn-green);
  --pro-green: var(--dn-green);
  --pro-pink: var(--dn-green);
  --pro-ink: var(--dn-page);
  --pro-panel: var(--dn-surface);
  --pro-panel-strong: var(--dn-page-raised);
  --pro-line: var(--dn-border-color);
  --pro-line-bright: #575757;
  background: var(--dn-page) !important;
}

.dn-pro-noise,
.dn-pro-orb,
.dn-pro-stage-glow,
.dn-pro-final-orbit {
  display: none !important;
}

.dn-pro-card,
.dn-pro-feature-card,
.dn-pro-price-card,
.dn-pro-platform-card,
.dn-pro-report-card,
.dn-pro-faq-card,
.dn-pro-panel {
  border-color: var(--dn-border-color) !important;
  background: var(--dn-surface) !important;
  box-shadow: none !important;
}

.dn-pro-button--primary {
  border-color: var(--dn-green) !important;
  background: var(--dn-green) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.dn-pro-button--primary:hover {
  border-color: var(--dn-green-hover) !important;
  background: var(--dn-green-hover) !important;
}

/* Admin */
body.is-admin {
  --dn-glass-bg: var(--dn-surface);
  --dn-glass-bg-2: var(--dn-page-raised);
  --dn-glass-border: var(--dn-border-color);
  --dn-glass-border-2: #555;
  --dn-glass-shadow: var(--dn-shadow-sm);
  --dn-grad-1: rgba(16, 163, 127, .12);
  --dn-grad-2: rgba(16, 163, 127, .08);
  --dn-grad-3: rgba(16, 163, 127, .06);
  --dn-focus: var(--dn-green);
  --dn-focus-ring: rgba(16, 163, 127, .24);
}

body.is-admin .dn-glass::before,
body.is-admin .dn-glass::after,
body.is-admin .aurora-card::before,
body.is-admin .aurora-card::after {
  display: none !important;
}

.dn-glass,
.dn-admin-page .table-responsive {
  border-color: var(--dn-border-color) !important;
  background: var(--dn-surface) !important;
  color: var(--dn-text-primary) !important;
  box-shadow: none !important;
}

/* Consent UI */
.cookie-consent-panel,
.cookie-pref-card {
  border-color: var(--dn-border-color) !important;
  border-radius: 14px !important;
  background: var(--dn-page-raised) !important;
  box-shadow: var(--dn-shadow-lg) !important;
  backdrop-filter: none !important;
}

.cookie-pref-backdrop {
  background: rgba(0, 0, 0, .72) !important;
}

@media (max-width: 991.98px) {
  .site-footer .footer-top-grid {
    grid-template-columns: 1fr 1fr;
  }

  .site-footer .footer-brand-area {
    grid-column: 1 / -1;
  }

  .dn-home-hero-stage {
    min-height: 0 !important;
  }
}

@media (max-width: 767.98px) {
  .dn-home-hero-stage,
  .site-footer .footer-top-grid {
    grid-template-columns: 1fr;
  }

  .site-footer .footer-brand-area {
    grid-column: auto;
  }

  .site-footer .footer-inner {
    padding-top: 24px;
  }

  .dn-device-card-web {
    grid-column: auto;
  }
}

@media (max-width: 575.98px) {
  .site-footer .container {
    padding-inline: 14px;
  }

  .dn-home-hero-shell,
  .dn-stats-panel,
  .dn-final-cta-shell,
  .dn-eco-roof-shell,
  .camera-intro-card,
  .kb-card,
  .mic-card,
  .monitor-card,
  .mouse-card,
  .test-card {
    border-radius: 12px !important;
  }

  .dn-home-title {
    font-size: clamp(2rem, 11vw, 3rem) !important;
  }
}
