/* Bootstack accent for Forgejo.
 *
 * Loaded by custom/templates/custom/header.tmpl, after the active theme's own
 * stylesheet, so plain `:root` wins on source order without a single
 * `!important`. The structure mirrors theme-forgejo-auto.css exactly: a light
 * `:root` block and a dark one inside the same media query upstream uses.
 *
 * Scope is the primary ramp and nothing else. Forgejo derives
 * --color-primary-hover, --color-primary-active and --color-accent from the
 * variables below with var(), so they follow on their own; the neutral
 * greys, the diff colours and the syntax highlighting stay upstream's,
 * where their contrast has been tested against the rest of the UI.
 *
 * The anchors are the brand's own teal, the same pair the Keycloak login theme
 * maps to --bootstack-accent: #097560 on paper, #0CC9AB on the dark ground.
 * They used to be #0f766e / #2dd4bf -- Tailwind teal, the --accent token of the
 * retired deploy/eos-apps/portal stack -- which was a visible half-step off the
 * teal every other surface in the estate paints with.
 *
 * The other fourteen rungs are not hand-picked. Each one is the Tailwind teal
 * rung it replaces, moved in OKLCH onto the brand's hue and chroma and shifted
 * by the same lightness delta the anchor moved (light -0.008 L, x1.085 chroma;
 * dark -0.037 L, x1.040 chroma). That keeps the ramp's spacing -- which is what
 * upstream's hover and active states are tuned against -- while making the one
 * value a reader actually recognises exact. Measured after the move: white on
 * the light primary 5.64:1, navy #0B192E on the dark primary 8.35:1, and the
 * dark primary on Forgejo's own dark ground 7.85:1.
 */

:root {
  --color-primary: #097560;
  --color-primary-contrast: #ffffff;

  --color-primary-dark-1: #097560;
  --color-primary-dark-2: #0e5d4c;
  --color-primary-dark-3: #0e5d4c;
  --color-primary-dark-4: #114d3f;
  --color-primary-dark-5: #114d3f;
  --color-primary-dark-6: #114d3f;
  --color-primary-dark-7: #114d3f;

  --color-primary-light-1: #009379;
  --color-primary-light-2: #00b797;
  --color-primary-light-3: #1bd3af;
  --color-primary-light-4: #55e9c6;
  --color-primary-light-5: #93f5da;
  --color-primary-light-6: #c8f9ea;
  --color-primary-light-7: #edfbf6;

  --color-primary-alpha-10: #09756019;
  --color-primary-alpha-20: #09756033;
  --color-primary-alpha-30: #0975604b;
  --color-primary-alpha-40: #09756066;
  --color-primary-alpha-50: #09756080;
  --color-primary-alpha-60: #09756099;
  --color-primary-alpha-70: #097560b3;
  --color-primary-alpha-80: #097560cc;
  --color-primary-alpha-90: #097560e1;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-primary: #0cc9ab;
    /* Navy, not black: #0B192E on #0CC9AB is the pairing the brand is specified
     * in (8.35:1), and it is what --bootstack-accent-ink resolves to in the
     * Keycloak theme's dark block. */
    --color-primary-contrast: #0b192e;

    --color-primary-dark-1: #4edfc1;
    --color-primary-dark-2: #4edfc1;
    --color-primary-dark-3: #8cead4;
    --color-primary-dark-4: #8cead4;
    --color-primary-dark-5: #c0efe2;
    --color-primary-dark-6: #c0efe2;
    --color-primary-dark-7: #e4f1ed;

    --color-primary-light-1: #00ad92;
    --color-primary-light-2: #008a74;
    --color-primary-light-3: #006c5b;
    --color-primary-light-4: #035447;
    --color-primary-light-5: #035447;
    --color-primary-light-6: #074539;
    --color-primary-light-7: #074539;

    --color-primary-alpha-10: #008a7419;
    --color-primary-alpha-20: #008a7433;
    --color-primary-alpha-30: #008a744b;
    --color-primary-alpha-40: #008a7466;
    --color-primary-alpha-50: #008a7480;
    --color-primary-alpha-60: #008a7499;
    --color-primary-alpha-70: #008a74b3;
    --color-primary-alpha-80: #008a74cc;
    --color-primary-alpha-90: #008a74e1;
  }
}

/* The OIDC button is the one control on the sign-in page that upstream leaves
 * neutral, and it is the control the whole estate exists for. Give it the
 * portal's primary-action treatment so "Sign in with Bootstack" reads as the
 * way in rather than as an alternative to the username field. */
.oauth-login-link {
  border-color: var(--color-primary) !important;
  color: var(--color-primary) !important;
  font-weight: 600;
}

.oauth-login-link:hover {
  background: var(--color-primary) !important;
  color: var(--color-primary-contrast) !important;
}