/* rNexa site: logo colouring, payment chooser, Mac install sheet and the review form */

/* The mark is the shared /site/rsh-core.svg, tinted per surface. */
img.mark { width: 22px; height: 22px; filter: brightness(0) invert(1); }
html:not([data-theme="dark"]) .nav.is-solid img.mark { filter: brightness(0); }
.app-tile img { display: block; width: 100%; height: 100%; filter: brightness(0) invert(0.96) drop-shadow(0 8px 24px rgba(5, 10, 22, 0.55)); }

/* Payment chooser revealed under Buy */
.price .btn-dark { border: 0; font: inherit; font-size: 15px; font-weight: 500; cursor: pointer; }
.pay { grid-column: 1 / -1; display: grid; gap: 12px; margin-top: 8px; padding-top: 24px; border-top: 1px solid var(--line); }
.pay-seam { font-size: 15px; font-weight: 500; }
.pay-now { display: flex; align-items: baseline; gap: 8px; }
.pay-now strong { font-size: 24px; font-weight: 600; letter-spacing: -0.03em; }
.pay-now span { font-size: 14px; color: var(--ink-3); }
.pays { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pay-btn {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--card); color: var(--ink); font: inherit; text-align: left; cursor: pointer;
  transition: background-color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.pay-btn:hover:not(:disabled) { background: var(--surface); border-color: var(--ink-3); }
.pay-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.pay-btn span:last-child { display: grid; }
.pay-btn b { font-weight: 500; }
.pay-btn em { font-size: 13px; font-style: normal; color: var(--ink-3); }
.pay-mark { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 8px; }
.pay-mark svg { width: 18px; height: 18px; }
.pay-mark.stripe { background: #635bff; }
.pay-mark.paypal { background: #ffffff; box-shadow: inset 0 0 0 1px var(--line); }
.pay-code-toggle { justify-self: start; padding: 0; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pay-code-row input { width: 100%; height: 42px; padding: 0 14px; border: 1px solid var(--field-line); border-radius: 12px; background: var(--card); color: var(--ink); font: inherit; letter-spacing: 0.06em; }
.pay-note, .pay .fine { margin: 0; font-size: 13px; color: var(--ink-3); }
.pay .fine a { text-decoration: underline; text-underline-offset: 3px; }
.pay-err { margin: 0; font-size: 14px; color: var(--danger); }

/* Mac install sheet */
.macx { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 16px; background: rgba(5, 10, 22, 0.55); backdrop-filter: blur(6px); }
.macx[hidden] { display: none; }
.macx-card { position: relative; width: min(460px, 100%); padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); color: var(--ink); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35); }
.macx .kicker { margin: 0; font-size: 13px; color: var(--ink-3); }
.macx-title { display: block; margin-top: 4px; font-size: 22px; font-weight: 600; letter-spacing: -0.03em; }
.macx-x { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 999px; background: var(--surface); color: var(--ink); cursor: pointer; }
.macx-steps { display: grid; gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; }
.macx-steps li { display: flex; gap: 12px; align-items: baseline; }
.macx-steps em { flex: none; font-size: 12px; font-style: normal; font-weight: 600; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.macx-steps span { display: grid; }
.macx-steps b { font-weight: 500; }
.macx-steps i { font-size: 13px; font-style: normal; color: var(--ink-2); }
.macx-notes { display: grid; gap: 6px; margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: var(--surface); }
.macx-warn { margin: 0; font-size: 13px; color: var(--ink-2); }
.macx-go { display: flex; justify-content: center; align-items: center; height: 44px; margin-top: 18px; border-radius: 999px; background: var(--pill-bg); color: var(--pill-ink); font-weight: 500; }
.macx-done { margin: 12px 0 0; font-size: 13px; color: var(--ok); text-align: center; }

/* Review writing: the summary keeps only its call to action; the wall above shows the reviews. */
.rv-legacy { margin-top: 20px; }
#rv-summary { display: flex; justify-content: center; }
#rv-summary[hidden] { display: none; }
#rv-summary .rv-score, #rv-summary .rv-dist, #rv-controls, #rv-list { display: none !important; }
.rv-cta { display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border: 1px solid var(--line); border-radius: 999px; background: none; color: var(--ink); font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
.rv-cta:hover { background: var(--surface); }
.rv-panel { display: none; }
.rv-panel.is-open { display: block; max-width: 640px; margin: 20px auto 0; text-align: left; }
.rv-panel-inner { padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--card); }
.rv-compose-head h3 { margin: 0; font-size: 18px; font-weight: 600; }
.rv-compose-head p { margin: 4px 0 16px; font-size: 14px; color: var(--ink-3); }
.rv-form { display: grid; gap: 14px; }
.rv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.rv-field { display: grid; gap: 6px; }
.rv-field > label { font-size: 14px; font-weight: 500; }
.rv-input, .rv-area { width: 100%; padding: 10px 14px; border: 1px solid var(--field-line); border-radius: 12px; background: var(--card); color: var(--ink); font: inherit; font-size: 15px; }
.rv-area { min-height: 110px; resize: vertical; }
.rv-input:focus, .rv-area:focus { outline: none; border-color: var(--ink-3); box-shadow: 0 0 0 4px rgba(127, 127, 127, 0.14); }
.rv-pick-row { display: flex; align-items: center; gap: 12px; }
.rv-pick { display: inline-flex; gap: 4px; }
.rv-pick button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 8px; background: none; cursor: pointer; }
.rv-pick svg, .rv-stars svg { width: 22px; height: 22px; fill: var(--line); }
.rv-pick svg.on, .rv-stars svg.on { fill: #f5a524; }
.rv-pick-note, .rv-counter { font-size: 13px; color: var(--ink-3); }
.rv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.rv-submit { height: 40px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--pill-bg); color: var(--pill-ink); font: inherit; font-weight: 500; cursor: pointer; }
.rv-ghost { height: 40px; padding: 0 16px; border: 1px solid var(--line); border-radius: 999px; background: none; color: var(--ink); font: inherit; cursor: pointer; }
.rv-danger { color: var(--danger); }
.rv-msg { margin: 0; font-size: 14px; color: var(--ink-2); }
.rv-msg.good { color: var(--ok); }
.rv-msg.bad { color: var(--danger); }

@media (max-width: 860px) {
  .pays, .rv-grid { grid-template-columns: 1fr; }
}