/*
 * Omnixia — shadcn-neutral theme for BTCPay Server
 *
 * Loaded as a custom theme extension, so it is appended after BTCPay's
 * default.css and only needs to restate the variables it changes. Everything
 * else in BTCPay derives from these, so overriding the brand ramp + radius +
 * type retints the whole app (backend and checkout) without touching markup.
 *
 * Palette is Tailwind zinc, matching the neutral monochrome used across
 * Omnixia. There is no accent hue by design: primary is near-black in light
 * mode and near-white in dark, exactly as shadcn's neutral base does it.
 * BTCPay's stock green (#51b13e) is fully replaced.
 */

:root {
  /* ---- zinc ramp ------------------------------------------------------ */
  --omnixia-50: #fafafa;
  --omnixia-100: #f4f4f5;
  --omnixia-200: #e4e4e7;
  --omnixia-300: #d4d4d8;
  --omnixia-400: #a1a1aa;
  --omnixia-500: #71717a;
  --omnixia-600: #52525b;
  --omnixia-700: #3f3f46;
  --omnixia-800: #27272a;
  --omnixia-900: #18181b;
  --omnixia-950: #09090b;

  /* ---- brand ---------------------------------------------------------- */
  --btcpay-brand-primary: var(--omnixia-900);
  --btcpay-brand-secondary: var(--omnixia-500);
  --btcpay-brand-tertiary: var(--omnixia-400);
  --btcpay-brand-dark: var(--omnixia-950);

  /* Primary ramp. BTCPay derives hovers/actives from 400-900, so the ramp
     runs light→dark and the hover states land one step darker than base. */
  --btcpay-primary-100: var(--omnixia-200);
  --btcpay-primary-100-rgb: 228, 228, 231;
  --btcpay-primary-200: var(--omnixia-300);
  --btcpay-primary-200-rgb: 212, 212, 216;
  --btcpay-primary-300: var(--omnixia-400);
  --btcpay-primary-300-rgb: 161, 161, 170;
  --btcpay-primary-400: var(--omnixia-500);
  --btcpay-primary-400-rgb: 113, 113, 122;
  --btcpay-primary-500: var(--omnixia-600);
  --btcpay-primary-500-rgb: 82, 82, 91;
  --btcpay-primary-600: var(--omnixia-700);
  --btcpay-primary-600-rgb: 63, 63, 70;
  --btcpay-primary-700: var(--omnixia-800);
  --btcpay-primary-700-rgb: 39, 39, 42;
  --btcpay-primary-800: var(--omnixia-900);
  --btcpay-primary-800-rgb: 24, 24, 27;
  --btcpay-primary-900: var(--omnixia-950);
  --btcpay-primary-900-rgb: 9, 9, 11;
  --btcpay-primary-rgb: 24, 24, 27;

  /* Solid buttons: near-black surface, white label — shadcn default. */
  --btcpay-primary: var(--omnixia-900);
  --btcpay-primary-accent: var(--omnixia-800);
  --btcpay-primary-text: #ffffff;
  --btcpay-primary-text-hover: #ffffff;
  --btcpay-primary-text-active: #ffffff;
  --btcpay-primary-shadow: rgba(24, 24, 27, 0.28);

  /* Links inherit the ink colour rather than a blue, with hover carrying
     the state change instead of hue. */
  --btcpay-body-link: var(--omnixia-900);
  --btcpay-body-link-accent: var(--omnixia-600);

  /* ---- shape & type --------------------------------------------------- */
  --btcpay-border-radius: .5rem;
  --btcpay-border-radius-l: .625rem;
  --btcpay-border-radius-xl: .75rem;
  --btcpay-border-radius-xxl: 1rem;

  --btcpay-font-family-base: ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --btcpay-font-family-monospace: ui-monospace, SFMono-Regular, "SF Mono",
    Menlo, Consolas, "Liberation Mono", monospace;
}

/* Dark mode: invert the primary so buttons read as light-on-dark, which is
   how shadcn's neutral theme behaves. BTCPay toggles this attribute itself. */
:root[data-btcpay-theme="dark"] {
  --btcpay-brand-primary: var(--omnixia-50);

  --btcpay-primary: var(--omnixia-50);
  --btcpay-primary-accent: var(--omnixia-200);
  --btcpay-primary-text: var(--omnixia-950);
  --btcpay-primary-text-hover: var(--omnixia-950);
  --btcpay-primary-text-active: var(--omnixia-950);
  --btcpay-primary-shadow: rgba(250, 250, 250, 0.18);
  --btcpay-primary-rgb: 250, 250, 250;

  --btcpay-body-link: var(--omnixia-50);
  --btcpay-body-link-accent: var(--omnixia-300);
}

/* Flatten the chrome: shadcn cards are a hairline border and no shadow. */
.card,
.list-group-item,
.btcpay-list-select__item {
  border-color: var(--btcpay-body-border-light);
  box-shadow: none;
}

/* Buttons sit slightly tighter and heavier than Bootstrap's default. */
.btn {
  font-weight: 500;
  letter-spacing: -0.006em;
}

/* Inputs: match the button radius and use a focus ring rather than a glow. */
.form-control,
.form-select {
  border-radius: var(--btcpay-border-radius);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--omnixia-400);
  box-shadow: 0 0 0 2px var(--btcpay-body-bg), 0 0 0 4px var(--omnixia-400);
}

/* Headings track shadcn's tighter display tracking. */
h1, h2, h3, .h1, .h2, .h3 {
  letter-spacing: -0.018em;
}


/* ─────────────────────────────────────────────────────────────────────────
   White label

   The payment page is Omnixia's, not a BTCPay page with our colours on it.
   Selectors verified against the live checkout markup rather than guessed:
   the footer is .store-footer and the attribution is .store-powered-by.

   BTCPay is AGPL and the source stays available at the fork; hiding the
   attribution in the customer-facing checkout is a branding decision, not a
   claim about who wrote it.
   ───────────────────────────────────────────────────────────────────────── */

.store-powered-by,
a[href*="btcpayserver.org"],
.store-footer a[href*="btcpay"] {
  display: none !important;
}

/* The footer exists only to hold the attribution, so it collapses with it. */
.store-footer:empty,
.store-footer {
  border: 0;
  padding-top: 0;
  min-height: 0;
}

/* ─────────────────────────────────────────────────────────────────────────
   Dark by default

   Omnixia is a dark product, and a checkout that opens white breaks the
   journey mid-payment. The backend matters as much as the checkout — it is
   the operator's daily view.

   The token names below were read out of BTCPay's own default.css rather than
   guessed. An earlier attempt set only the four obvious ones, which darkened
   the background while leaving navigation and table text on their light-mode
   colours — dark grey on near-black, effectively invisible.
   ───────────────────────────────────────────────────────────────────────── */

:root,
:root[data-btcpay-theme="dark"] {
  /* Brand */
  --btcpay-brand-primary: var(--omnixia-50);
  --btcpay-primary: var(--omnixia-50);
  --btcpay-primary-accent: var(--omnixia-200);
  --btcpay-primary-text: var(--omnixia-950);
  --btcpay-primary-text-hover: var(--omnixia-950);
  --btcpay-primary-text-active: var(--omnixia-950);
  --btcpay-primary-shadow: rgba(250, 250, 250, 0.18);
  --btcpay-primary-rgb: 250, 250, 250;

  /* Page surfaces */
  --btcpay-body-bg: var(--omnixia-950);
  --btcpay-body-bg-rgb: 9, 9, 11;
  --btcpay-body-bg-light: var(--omnixia-900);
  --btcpay-body-bg-medium: var(--omnixia-800);
  --btcpay-body-bg-hover: var(--omnixia-800);
  --btcpay-body-bg-active: var(--omnixia-800);
  --btcpay-body-bg-striped: var(--omnixia-900);
  --btcpay-bg-tile: var(--omnixia-900);
  --btcpay-bg-dark: var(--omnixia-950);

  /* Text — the part that was missing, and why the sidebar vanished */
  --btcpay-body-text: var(--omnixia-50);
  --btcpay-body-text-rgb: 250, 250, 250;
  --btcpay-body-text-hover: var(--omnixia-50);
  --btcpay-body-text-active: #ffffff;
  --btcpay-body-text-striped: var(--omnixia-100);
  /* 400 on 950 clears 7:1, so addresses and labels stay readable. */
  --btcpay-body-text-muted: var(--omnixia-400);

  --btcpay-body-link: var(--omnixia-50);
  --btcpay-body-link-accent: var(--omnixia-300);
  --btcpay-body-link-rgb: 250, 250, 250;
  --btcpay-body-link-accent-rgb: 212, 212, 216;

  --btcpay-body-border-light: var(--omnixia-800);
  --btcpay-body-border-medium: var(--omnixia-700);
  --btcpay-body-shadow: rgba(0, 0, 0, 0.4);

  /* Sidebar */
  --btcpay-nav-bg: var(--omnixia-950);
  --btcpay-nav-bg-hover: var(--omnixia-900);
  --btcpay-nav-bg-active: var(--omnixia-800);
  --btcpay-nav-border: var(--omnixia-800);
  --btcpay-nav-border-hover: var(--omnixia-700);
  --btcpay-nav-border-active: var(--omnixia-600);
  --btcpay-nav-link: var(--omnixia-300);
  --btcpay-nav-link-accent: var(--omnixia-50);
  --btcpay-nav-link-active: var(--omnixia-50);

  /* Header and content chrome */
  --btcpay-header-bg: var(--omnixia-950);
  --btcpay-header-text: var(--omnixia-50);
  --btcpay-content-bg: var(--omnixia-950);

  /* Forms */
  --btcpay-form-bg: var(--omnixia-900);
  --btcpay-form-bg-addon: var(--omnixia-800);
  --btcpay-form-bg-hover: var(--omnixia-800);
  --btcpay-form-bg-disabled: var(--omnixia-800);
  --btcpay-form-text: var(--omnixia-50);
  --btcpay-form-text-addon: var(--omnixia-300);
  --btcpay-form-text-label: var(--omnixia-200);
  --btcpay-form-border: var(--omnixia-700);
  --btcpay-form-border-hover: var(--omnixia-600);
  --btcpay-form-border-focus: var(--omnixia-400);
  --btcpay-form-border-active: var(--omnixia-400);
  --btcpay-form-border-check: var(--omnixia-400);
  --btcpay-form-border-disabled: var(--omnixia-800);

  /* Tables */
  --btcpay-table-border: var(--omnixia-800);
  --btcpay-table-bg-hover: var(--omnixia-900);

  /*
   * Neutral ramp, inverted.
   *
   * BTCPay builds small surfaces from these — the order-id chip is
   * neutral-100 on a neutral-200 border — and they are the reason those chips
   * stayed white on a dark page. Inverting the ramp fixes every component
   * built from it at once, instead of overriding each one and breaking its
   * layout in the process.
   */
  --btcpay-neutral-100: var(--omnixia-900);
  --btcpay-neutral-200: var(--omnixia-800);
  --btcpay-neutral-300: var(--omnixia-700);
  --btcpay-neutral-400: var(--omnixia-600);
  --btcpay-neutral-500: var(--omnixia-500);
  --btcpay-neutral-600: var(--omnixia-400);
  --btcpay-neutral-700: var(--omnixia-300);
  --btcpay-neutral-800: var(--omnixia-200);
  --btcpay-neutral-900: var(--omnixia-50);
}

/* Surfaces Bootstrap paints directly rather than through a token. */
body,
.min-vh-100,
.public-page-wrap,
main,
#mainContent {
  background: var(--omnixia-950);
  color: var(--omnixia-50);
}

.card,
.list-group-item,
.btcpay-list-select__item {
  background: var(--omnixia-900);
  color: var(--omnixia-50);
}

/* Status pills ship in Bootstrap green; the palette has no accent hue. */
.badge.bg-success,
.badge-success,
.btcpay-status--complete,
.btcpay-status--settled {
  background: var(--omnixia-800) !important;
  color: var(--omnixia-50) !important;
}

.badge.bg-warning,
.badge-warning {
  background: var(--omnixia-700) !important;
  color: var(--omnixia-50) !important;
}

/* The backend footer is BTCPay's own attribution and social links. */
footer .btcpay-version,
footer a[href*="github.com/btcpayserver"],
footer a[href*="twitter.com/btcpayserver"],
footer a[href*="t.me/btcpayserver"],
footer a[href*="chat.btcpayserver.org"] {
  display: none !important;
}


/* ─────────────────────────────────────────────────────────────────────────
   Inputs and copy fields

   The invoice list renders order ids in a copy widget that carries its own
   white background rather than reading --btcpay-form-bg, so it stayed light
   while everything around it went dark — white text on white.

   Targeted by element as well as class: the widget's markup is not visible
   without an admin session, and covering the elements themselves is more
   reliable than guessing which of BTCPay's classes it happens to use.
   ───────────────────────────────────────────────────────────────────────── */

/*
 * Form surfaces only.
 *
 * An earlier version also forced a background and border onto the
 * .truncate-center family. Those elements own BTCPay's ellipsis layout, and
 * overriding them made the order id overflow its chip and run into the next
 * column — worse than the contrast problem it was meant to fix. Layout
 * belongs to BTCPay; only colour is ours to set.
 */
input,
textarea,
select,
.form-control,
.form-select,
.input-group-text {
  background-color: var(--omnixia-900) !important;
  color: var(--omnixia-50) !important;
  border-color: var(--omnixia-700) !important;
}

/* Checkboxes and radios are drawn, not filled — a dark box would hide them. */
input[type="checkbox"],
input[type="radio"] {
  background-color: var(--omnixia-800) !important;
  border-color: var(--omnixia-600) !important;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background-color: var(--omnixia-50) !important;
  border-color: var(--omnixia-50) !important;
}

::placeholder {
  color: var(--omnixia-500) !important;
  opacity: 1;
}

/*
 * The copy widget is left entirely alone.
 *
 * .truncate-center-id takes its chip colours from the neutral ramp, which is
 * inverted below — so it follows dark mode without a single override here.
 *
 * .truncate-center-text is deliberately NOT styled: BTCPay hides the full
 * string with `color: transparent` rather than display:none, so giving it a
 * colour makes the entire id visible and spill out of the chip. That was the
 * overflow, and it was mine.
 */
.truncate-center a,
.truncate-center button,
.truncate-center .btn {
  color: var(--omnixia-300);
}

/* Bootstrap status pills, which ship in green and blue. The palette has no
   accent hue by design. */
.badge.text-bg-success,
.badge.text-bg-primary,
.badge.text-bg-info,
.badge.text-bg-secondary,
.badge.text-bg-light,
.badge.bg-success,
.badge.bg-primary,
.badge.bg-info {
  background-color: var(--omnixia-800) !important;
  color: var(--omnixia-50) !important;
}

.badge.text-bg-warning,
.badge.bg-warning {
  background-color: var(--omnixia-700) !important;
  color: var(--omnixia-50) !important;
}

/* Remaining BTCPay attribution in the backend footer. */
footer .text-muted:last-child,
footer a[href*="twitter.com"],
footer a[href*="t.me/"],
footer a[href*="github.com/btcpayserver"],
footer a[href*="docs.btcpayserver.org"] {
  display: none !important;
}