/* =========================================================================
   Inspira theme for scan.inspace.id
   Injected only on that host by nginx (sub_filter before </head>), after app.css.
   Re-tints the Naikyu red to Inspira orange and gives buttons the same
   tactile, top-lit treatment as the inspace.id landing page.
   ========================================================================= */

:root {
  --bg-glow-1: rgba(234, 88, 12, .09);
  --bg-glow-2: rgba(251, 146, 60, .08);
  --brand: #ea580c;
  --brand-2: #fb8a3c;
  --brand-deep: #c2410c;
  --brand-ink: #ffffff;
  --brand-soft: #fff3eb;
  --brand-ring: rgba(234, 88, 12, .2);
  --brand-glow: rgba(234, 88, 12, .5);
  --shadow-cta: 0 8px 20px -8px rgba(234, 88, 12, .55);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-glow-1: rgba(249, 115, 22, .09);
    --bg-glow-2: rgba(251, 146, 60, .05);
    --brand: #f97316;
    --brand-2: #fd9a55;
    --brand-deep: #e2600b;
    --brand-soft: #2a1a10;
    --brand-ring: rgba(249, 115, 22, .28);
    --brand-glow: rgba(249, 115, 22, .45);
    --shadow-cta: 0 8px 22px -8px rgba(249, 115, 22, .5);
  }
}
:root[data-theme="dark"] {
  --bg-glow-1: rgba(249, 115, 22, .09);
  --bg-glow-2: rgba(251, 146, 60, .05);
  --brand: #f97316;
  --brand-2: #fd9a55;
  --brand-deep: #e2600b;
  --brand-soft: #2a1a10;
  --brand-ring: rgba(249, 115, 22, .28);
  --brand-glow: rgba(249, 115, 22, .45);
  --shadow-cta: 0 8px 22px -8px rgba(249, 115, 22, .5);
}

/* ---- Primary: raised, lit from above, presses in ---- */
.btn-primary,
.btn-primary:hover {
  background: linear-gradient(180deg, var(--brand-2) 0%, var(--brand) 52%, var(--brand-deep) 100%);
  background-size: 100% 100%;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .12);
}
.btn-primary {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .3),
    inset 0 -2px 0 rgba(0, 0, 0, .14),
    0 1px 2px rgba(16, 24, 40, .14),
    0 8px 20px -8px var(--brand-glow);
}
.btn-primary:hover {
  transform: translateY(-1px);
  filter: saturate(1.05) brightness(1.03);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .34),
    inset 0 -2px 0 rgba(0, 0, 0, .14),
    0 2px 4px rgba(16, 24, 40, .12),
    0 14px 28px -10px var(--brand-glow);
}
.btn-primary:active {
  transform: translateY(1px);
  filter: none;
  background: linear-gradient(180deg, var(--brand) 0%, var(--brand-deep) 100%);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .2), 0 1px 1px rgba(16, 24, 40, .1);
  transition-duration: .06s;
}
.btn-primary::after { background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .32) 50%, transparent 65%); }

/* ---- Secondary / ghost: quiet hover, no jump ---- */
.btn:not(.btn-primary):hover {
  transform: none;
  background: var(--surface-2);
  border-color: var(--border-strong);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
}
.btn:not(.btn-primary):active { transform: translateY(1px); }
.btn-ghost:hover { border-color: transparent; box-shadow: none; }
.btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }