/* ==================== TechTiera brand overrides ====================
   Appended to Vaultwarden's own css/vaultwarden.css (its designed
   customisation hook). Pinned to image 1.37.1-alpine — re-check the
   selectors if that tag is ever bumped.
   ================================================================== */

/* Palette. Bitwarden's web vault stores colours as space-separated RGB
   triplets so Tailwind can apply opacity to them. !important on a custom
   property beats specificity, which is what we need to override .theme_*. */
:root {
  --color-primary-100: 219 234 254 !important;  /* #DBEAFE */
  --color-primary-300: 74 122 191 !important;   /* #4A7ABF */
  --color-primary-600: 21 101 192 !important;   /* #1565C0  TechTiera blue */
  --color-primary-700: 13 71 132 !important;    /* #0D4784 */
}

html.theme_dark {
  --color-primary-100: 26 58 92 !important;     /* #1A3A5C */
  --color-primary-300: 108 117 125 !important;
  --color-primary-600: 125 175 240 !important;  /* lifted for dark bg */
  --color-primary-700: 219 234 254 !important;
}

/* Login / landing wordmark. It ships as an INLINE <svg> (not an <img>), so
   content:url() can't touch it — blank the paths and paint ours behind. */
svg:has(> path.tw-fill-marketing-logo) {
  background-image: url("images/techtiera-logo.png");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}
svg:has(> path.tw-fill-marketing-logo) > path {
  display: none !important;
}

/* The loading-splash logo IS an <img>, and it is set via content:url(). */
img.new-logo-themed,
html.theme_light img.new-logo-themed,
html.theme_dark img.new-logo-themed {
  content: url("images/techtiera-logo.png") !important;
}

/* Sidebar mark, once logged in. Vaultwarden's own rule here uses
   icon-white.svg, so the nav is dark and the mark must be white.
   brightness(0) invert(1) flattens every opaque pixel to white, which would
   swallow the knocked-out "T" inside the icon block — so scroll the icon out
   of frame with a negative offset and show the wordmark only. 34px offset =
   the icon's width once the 496x107 source is scaled to 32px tall. */
bit-nav-logo bit-nav-item a:before {
  content: "" !important;
  display: block !important;
  background-image: url("images/techtiera-logo.png") !important;
  background-repeat: no-repeat !important;
  background-size: auto 32px !important;
  background-position: -34px center !important;
  width: 116px !important;
  height: 32px !important;
  filter: brightness(0) invert(1);
}