/* The login / signup links remain visible on purpose — only the admin
   (provisioned via vault) has a working account, but the operator
   wants the Sign-In affordance visible so they can log in. Public
   sign-up is disabled at the OTS config level (AUTH_SIGNUP=false)
   so the Sign-Up link, if Vue renders one, will 404 the form
   submission rather than create accounts. */

/* Hide ONLY the public "Sign Up" link if Vue exposes one — leave
   Sign In + Logout + Account links alone. */
a[href*="/signup"],
a[href*="/register"] {
    display: none !important;
}

/* Hide the stock OTS orange "S" logo. The Vue bundle renders it as
   a bg-orange-* div with a single uppercase letter, often inside the
   navbar / header. We use a broad set of selectors because the exact
   Tailwind classes vary across OTS minor releases. The post-mount
   JS (oneclick.js) overlays our oneclick logo as an absolutely-
   positioned <img id="oneclick-logo-overlay">; this CSS just makes
   sure the original orange box isn't visible underneath. */
header .bg-orange-500,
header .bg-orange-600,
header div[class*="bg-orange"],
header [class*="rounded"][class*="orange"],
header img[alt*="onetime" i],
header img[alt*="logo" i],
.navbar .bg-orange-500,
a.logo > *,
.navbar-brand > * {
    visibility: hidden !important;
}
/* Reserve space at top of viewport so the absolute-positioned overlay
   doesn't overlap the form area. */
body { padding-top: 16px; }

/* Solid oneclick-brand background colour. (Wallpaper images would be
   nice but exceed the 1 MiB K8s Secret limit; revisit with an init-
   container + emptyDir if/when this matters.) */
body {
    background-color: #f7f7f7;
}
html.dark body {
    background-color: #0a0e1a;
}

/* oneclick brand red overrides the OTS orange. Targets the most common
   Tailwind/utility classes the OTS frontend uses for primary actions. */
:root {
    --ots-accent: #E50914;
    --ots-accent-dark: #B0070F;
}
a, a:visited { color: var(--ots-accent); }
a:hover { color: var(--ots-accent-dark); }
.btn-primary, button.primary, input[type="submit"].primary,
button[type="submit"].btn, button.bg-orange-500, .bg-orange-500 {
    background-color: var(--ots-accent) !important;
    border-color: var(--ots-accent) !important;
    color: #ffffff !important;
}
.btn-primary:hover, button.primary:hover {
    background-color: var(--ots-accent-dark) !important;
    border-color: var(--ots-accent-dark) !important;
}
.text-orange-500, .text-orange-600 {
    color: var(--ots-accent) !important;
}