/* CL_VISUAL_REGRESSION_FIXES_V1
   Cross-page corrections validated from the pre-production Safari review.
   This layer is deliberately visual: no API or alert-domain behavior lives here. */

/* Account: do not stretch the contextual rail into an empty second page. */
body[data-cl-design-core="v1"] .compte-hero {
  align-items: start !important;
}

body[data-cl-design-core="v1"] .compte-side {
  position: sticky !important;
  top: 18px !important;
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
}

/* Safari can retain the generic white button text over the dark-theme light gradient. */
html[data-theme="dark"] body[data-cl-design-core="v1"] .compte-form button.primary,
html[data-theme="dark"] body[data-cl-design-core="v1"] .compte-form .btn.primary {
  color: #071426 !important;
  -webkit-text-fill-color: #071426 !important;
}

html[data-theme="dark"] body[data-cl-design-core="v1"] .compte-form button.primary:disabled,
html[data-theme="dark"] body[data-cl-design-core="v1"] .compte-form .btn.primary:disabled {
  border-color: rgba(133, 171, 222, .24) !important;
  background: #172c48 !important;
  color: #afc1d8 !important;
  -webkit-text-fill-color: #afc1d8 !important;
  opacity: 1 !important;
}

html[data-theme="light"] body[data-cl-design-core="v1"] .compte-form button.primary:disabled,
html[data-theme="light"] body[data-cl-design-core="v1"] .compte-form .btn.primary:disabled {
  border-color: #c7d5e6 !important;
  background: #e7edf5 !important;
  color: #61738a !important;
  -webkit-text-fill-color: #61738a !important;
  opacity: 1 !important;
}

/* Public signals: keep form controls readable in both themes, including disabled selects. */
html[data-theme="dark"] body #q,
html[data-theme="dark"] body #ex {
  border-color: rgba(135, 178, 230, .3) !important;
  background: #0b213c !important;
  color: #eef6ff !important;
  -webkit-text-fill-color: #eef6ff !important;
}

html[data-theme="dark"] body #q::placeholder {
  color: #9bacc1 !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body #ex:disabled {
  border-color: rgba(135, 178, 230, .22) !important;
  background: #122742 !important;
  color: #b4c3d5 !important;
  -webkit-text-fill-color: #b4c3d5 !important;
  opacity: 1 !important;
}

html[data-theme="light"] body #ex:disabled {
  border-color: #c7d3e0 !important;
  background: #eef2f6 !important;
  color: #55677d !important;
  -webkit-text-fill-color: #55677d !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body .cl-top .cl-sub,
html[data-theme="dark"] body .cl-top .note,
html[data-theme="dark"] body .cl-card .note {
  color: #b7c6d9 !important;
  opacity: 1 !important;
}

/* Requester hero: neutralize the legacy side-card stretch around the Telegram example. */
body[data-cl-requester-revision="v1"] .cl-p1-hero-side {
  align-self: center !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] body[data-cl-requester-revision="v1"] .cl-r2-hero-preview {
  border-color: rgba(46, 82, 126, .16) !important;
  background: linear-gradient(150deg, #f5f8fc, #e9eff6) !important;
  box-shadow: 0 24px 55px rgba(28, 54, 88, .16) !important;
}

html[data-theme="light"] body[data-cl-requester-revision="v1"] .cl-r2-preview-caption,
html[data-theme="light"] body[data-cl-requester-revision="v1"] .cl-r2-preview-foot {
  color: #52677f !important;
}

html[data-theme="light"] body[data-cl-requester-revision="v1"] .cl-r2-live-dot {
  color: #13775c !important;
}

/* Requester proof: Telegram and summary come before the optional graph. */
body[data-cl-requester-revision="v1"] #cl-p1-proof-panel {
  position: relative !important;
  top: auto !important;
  align-self: start !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel .cl-p1-proof-head,
body[data-cl-requester-revision="v1"] #cl-p1-proof-panel #cl-p1-proof-story {
  order: 0 !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel .cl-r2-proof-preview {
  order: 1 !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel #cl-p1-summary-card {
  order: 2 !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel .rightTop {
  order: 3 !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel .chartBox,
body[data-cl-requester-revision="v1"] #cl-p1-proof-panel #chart {
  order: 4 !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel .cl-rq-chart-fallback {
  order: 5 !important;
  margin: 0 26px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(133, 169, 214, .16) !important;
  border-radius: 13px !important;
  color: var(--cl-r2-muted) !important;
  background: rgba(112, 154, 210, .07) !important;
}

body[data-cl-requester-revision="v1"] #cl-p1-proof-panel[data-cl-r2-chart-unavailable="1"] .chartBox,
body[data-cl-requester-revision="v1"] #cl-p1-proof-panel[data-cl-r2-chart-unavailable="1"] #chart,
body[data-cl-requester-revision="v1"] #cl-p1-proof-panel[data-cl-r2-chart-unavailable="1"] .rightTop {
  display: none !important;
}

/* Explicit refresh contrast; the legacy button can be enabled but still inherit pale text. */
html[data-theme="light"] body[data-cl-requester-revision="v1"] #btnRefresh {
  border-color: #b8cbe2 !important;
  background: #e5eef9 !important;
  color: #285486 !important;
  -webkit-text-fill-color: #285486 !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body[data-cl-requester-revision="v1"] #btnRefresh {
  border-color: rgba(129, 174, 232, .32) !important;
  background: #17375e !important;
  color: #e4effd !important;
  -webkit-text-fill-color: #e4effd !important;
  opacity: 1 !important;
}

/* Public live-signals introductory copy must meet normal-text contrast. */
html[data-theme="light"] body #cl-live-sub.cl-shell-copy {
  color: #405674 !important;
  opacity: 1 !important;
}

html[data-theme="light"] body[data-cl-requester-revision="v1"] #btnRefresh:disabled {
  border-color: #c4d3e5 !important;
  background: #e5edf7 !important;
  color: #60758f !important;
  -webkit-text-fill-color: #60758f !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body[data-cl-requester-revision="v1"] #btnRefresh:disabled {
  border-color: rgba(129, 174, 232, .2) !important;
  background: #142a46 !important;
  color: #a9bdd6 !important;
  -webkit-text-fill-color: #a9bdd6 !important;
  opacity: 1 !important;
}

@media (max-width: 920px) {
  body[data-cl-design-core="v1"] .compte-side {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
  }
}
