/* Shared theme layer for every front-end modal, popover and floating panel. */
:root {
  --dialog-surface: rgba(255, 255, 255, .97);
  --dialog-surface-solid: #fff;
  --dialog-soft: #f3f7fa;
  --dialog-soft-hover: #eaf4f7;
  --dialog-text: #17283a;
  --dialog-copy: #536d80;
  --dialog-muted: #8194a5;
  --dialog-line: rgba(42, 77, 110, .14);
  --dialog-accent: #24778b;
  --dialog-accent-soft: #e3f6f9;
  --dialog-overlay: rgba(26, 43, 58, .36);
  --dialog-shadow: 0 30px 90px rgba(25, 55, 75, .24);
  --dialog-close-bg: rgba(239, 246, 249, .94);
  --dialog-close-fg: #4f6b7d;
  --dialog-input: #fbfdff;
}

html[data-theme="dark"] {
  --dialog-surface: rgba(12, 25, 34, .98);
  --dialog-surface-solid: #0d1b24;
  --dialog-soft: #12232f;
  --dialog-soft-hover: #17303c;
  --dialog-text: #edf5f7;
  --dialog-copy: #b9cbd3;
  --dialog-muted: #8ea5b5;
  --dialog-line: rgba(151, 190, 204, .16);
  --dialog-accent: #77cedb;
  --dialog-accent-soft: #153642;
  --dialog-overlay: rgba(1, 8, 13, .72);
  --dialog-shadow: 0 34px 100px rgba(0, 0, 0, .48);
  --dialog-close-bg: #142934;
  --dialog-close-fg: #a9c0ca;
  --dialog-input: #0a1720;
}

.home-coin-pop>article,
.newpow-detail>article,
.cg-shell,
.pc-detail-shell,
.pc-pool-pop,
.monitor-detail-shell,
.forum-compose,
.notification-popover,
.account-popover,
.global-search-results,
.tool-compare-bar,
dialog,
[role="dialog"] {
  border-color: var(--dialog-line) !important;
  background: var(--dialog-surface) !important;
  color: var(--dialog-text) !important;
  box-shadow: var(--dialog-shadow) !important;
  color-scheme: light;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

html[data-theme="dark"] .home-coin-pop>article,
html[data-theme="dark"] .newpow-detail>article,
html[data-theme="dark"] .cg-shell,
html[data-theme="dark"] .pc-detail-shell,
html[data-theme="dark"] .pc-pool-pop,
html[data-theme="dark"] .monitor-detail-shell,
html[data-theme="dark"] .forum-compose,
html[data-theme="dark"] .notification-popover,
html[data-theme="dark"] .account-popover,
html[data-theme="dark"] .global-search-results,
html[data-theme="dark"] .tool-compare-bar,
html[data-theme="dark"] dialog,
html[data-theme="dark"] [role="dialog"] { color-scheme: dark; }

.coin-pop-backdrop,
.newpow-detail>div:first-child,
.cg-backdrop,
.pc-backdrop,
.forum-modal,
.monitor-coin-detail {
  background: var(--dialog-overlay) !important;
  backdrop-filter: blur(10px) saturate(105%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(105%) !important;
  transition: background-color .18s ease;
}

/* Typography */
.home-coin-pop h2,
.newpow-detail h2,
.cg-shell h2,
.cg-shell h3,
.pc-detail-shell h2,
.pc-detail-shell h3,
.pc-pool-pop h3,
.pc-pool-pop h4,
.monitor-detail-shell h2,
.monitor-detail-shell h3,
.forum-compose h2,
.notification-popover h3,
.account-popover b,
.global-search-results b { color: var(--dialog-text) !important; }

.coin-pop-desc,
.newpow-detail article>p,
.cg-info p,
.pc-detail-head p,
.pc-pool-list p,
.monitor-detail-shell p,
.forum-compose label,
.notification-item span small,
.notification-empty p,
.account-popover small,
.global-search-results em { color: var(--dialog-copy) !important; }

.home-coin-pop small,
.newpow-detail small,
.cg-shell small,
.pc-detail-shell small,
.pc-pool-pop small,
.monitor-detail-shell small,
.notification-popover time,
.global-search-section>small { color: var(--dialog-muted) !important; }

/* Secondary cards inside dialogs */
.home-coin-pop section div,
.newpow-detail section div,
.cg-kpis,
.cg-kpis div,
.cg-info aside,
.pc-detail-kpis article,
.pc-charts article,
.pc-pool-list,
.monitor-detail-shell .coin-detail-kpis article,
.monitor-detail-shell .coin-chart-grid article,
.monitor-detail-shell .coin-pools,
.forum-compose .compose-tip,
.notification-item.is-unread,
.notification-empty>i,
.account-popover nav i,
.theme-options button,
.global-search-item>i {
  border-color: var(--dialog-line) !important;
  background: var(--dialog-soft) !important;
  color: var(--dialog-text) !important;
}

.cg-kpis { gap: 1px; }

/* Forms and controls */
.home-coin-pop button,
.home-coin-pop a,
.newpow-detail button,
.newpow-detail a,
.cg-shell button,
.cg-shell a,
.pc-detail-shell button,
.pc-detail-shell a,
.pc-pool-pop button,
.pc-pool-pop a,
.monitor-detail-shell button,
.monitor-detail-shell a,
.forum-compose button,
.notification-popover button,
.account-popover button,
.global-search-results button,
.tool-compare-bar button {
  border-color: var(--dialog-line) !important;
}

.forum-compose input,
.forum-compose select,
.forum-compose textarea,
.newpow-detail input,
.newpow-detail select,
.newpow-detail textarea,
.cg-shell input,
.cg-shell select,
.pc-detail-shell input,
.pc-detail-shell select,
.pc-detail-shell textarea,
.monitor-detail-shell input,
.monitor-detail-shell select,
.monitor-detail-shell textarea,
dialog input,
dialog select,
dialog textarea,
[role="dialog"] input,
[role="dialog"] select,
[role="dialog"] textarea {
  border-color: var(--dialog-line) !important;
  background: var(--dialog-input) !important;
  color: var(--dialog-text) !important;
}

.coin-pop-close,
.newpow-detail>article>button,
.cg-close,
.pc-close,
.pc-pool-pop>button,
.monitor-detail-close,
.compose-close {
  border: 1px solid var(--dialog-line) !important;
  background: var(--dialog-close-bg) !important;
  color: var(--dialog-close-fg) !important;
  box-shadow: none !important;
}

.coin-pop-close:before,
.coin-pop-close:after { background: var(--dialog-close-fg) !important; }

.coin-pop-close:hover,
.newpow-detail>article>button:hover,
.cg-close:hover,
.pc-close:hover,
.pc-pool-pop>button:hover,
.monitor-detail-close:hover,
.compose-close:hover {
  border-color: color-mix(in srgb, var(--dialog-accent) 48%, transparent) !important;
  background: var(--dialog-accent-soft) !important;
  color: var(--dialog-accent) !important;
}

/* Rows, separators and popovers */
.pc-pool-row,
.coin-pool-row,
.notification-popover>header,
.notification-popover>footer,
.account-popover>header,
.account-popover>section,
.account-popover>footer,
.global-search-section+.global-search-section {
  border-color: var(--dialog-line) !important;
}

.pc-pool-data,
.coin-pool-row,
.global-search-item,
.notification-item,
.account-popover nav a,
.account-popover nav button { color: var(--dialog-text) !important; }

.pc-pool-data:hover,
.global-search-item:hover,
.global-search-item.is-active,
.notification-item:hover,
.account-popover nav a:hover,
.account-popover nav button:hover { background: var(--dialog-soft-hover) !important; }

.notification-item.is-read>i { background: var(--dialog-soft) !important; color: var(--dialog-muted) !important; }
.notification-popover header h3 span,
.global-search-all,
.theme-options button.active { background: var(--dialog-accent-soft) !important; color: var(--dialog-accent) !important; }

/* Keep charts visible in dark mode. */
html[data-theme="dark"] .pc-chart polyline,
html[data-theme="dark"] .coin-chart-grid polyline,
html[data-theme="dark"] .cg-chart polyline { filter: brightness(1.22) saturate(.9); }
html[data-theme="dark"] .pc-chart line,
html[data-theme="dark"] .coin-chart-grid line,
html[data-theme="dark"] .cg-chart line { stroke: rgba(155, 188, 203, .22) !important; }

@media (prefers-reduced-motion: reduce) {
  .home-coin-pop>article,
  .newpow-detail>article,
  .cg-shell,
  .pc-detail-shell,
  .pc-pool-pop,
  .monitor-detail-shell,
  .forum-compose,
  .notification-popover,
  .account-popover,
  .global-search-results { transition: none !important; }
}

