/* CannonSign brand overlay — recolors DocuSeal's purple/neutral chrome to
   the CCASign blue palette (matches the marketing landing's --primary).
   Loaded late (from _head_tags after the bundled stylesheet) so we win on
   cascade without needing !important. */

:root {
  --ccasign-primary: #2563EB;       /* blue-600 — matches landing --primary */
  --ccasign-primary-dark: #1D4ED8;  /* blue-700 — matches landing --primary-hover */
  --ccasign-accent: #14b8a6;        /* teal-500 (kept for non-primary highlights) */
  --ccasign-accent-dark: #0f766e;   /* teal-700 */
  --ccasign-on-primary: #ffffff;
}

/* daisyUI semantic tokens used by DocuSeal's "docuseal" theme. Override the
   primary swatch + the dark "base-content" surface used for the navbar
   avatar circle and email/icon backgrounds. */
[data-theme="docuseal"],
:root {
  --p:  221 83% 53%;   /* primary  → #2563EB blue-600 */
  --pf: 224 76% 48%;   /* primary-focus → #1D4ED8 blue-700 */
  --pc: 0 0% 100%;     /* primary-content → white */
  --a:  173 80% 40%;   /* accent → teal-500 */
  --af: 174 80% 26%;   /* accent-focus → teal-700 */
  --ac: 0 0% 100%;     /* accent-content → white */
}

/* The user-avatar circle in the navbar uses `bg-base-content text-purple-300`
   — repaint to brand. */
.text-purple-300 {
  color: #BFDBFE !important;        /* blue-200 */
}
.bg-base-content {
  background-color: var(--ccasign-primary-dark) !important;
  color: var(--ccasign-on-primary) !important;
}

/* Buttons that DocuSeal emits with `.base-button` (used on sign-in / setup /
   most form submits) — ensure they read as our brand blue. */
.base-button {
  background-color: var(--ccasign-primary) !important;
  border-color: var(--ccasign-primary) !important;
  color: var(--ccasign-on-primary) !important;
}
.base-button:hover {
  background-color: var(--ccasign-primary-dark) !important;
  border-color: var(--ccasign-primary-dark) !important;
}

/* daisyUI btn-neutral (used for the dropdown menus, "Sign Up" pill, etc.)
   — recolor so nothing reads purple. */
.btn-neutral:not(.btn-outline) {
  background-color: var(--ccasign-primary-dark) !important;
  border-color: var(--ccasign-primary-dark) !important;
  color: var(--ccasign-on-primary) !important;
}
.btn-neutral.btn-outline {
  color: var(--ccasign-primary-dark) !important;
  border-color: var(--ccasign-primary-dark) !important;
  background-color: transparent !important;
}
.btn-neutral.btn-outline:hover {
  background-color: var(--ccasign-primary-dark) !important;
  color: var(--ccasign-on-primary) !important;
}

/* Links on the sign-in page (forgot password, create account, language) */
.link, a.link-hover {
  color: var(--ccasign-primary-dark);
}
.link-neutral { color: var(--ccasign-primary-dark) !important; }

/* daisyUI badge-outline (the version pill on the legacy landing — gone now,
   but keep this for any other badge surface). */
.badge-outline {
  color: var(--ccasign-primary-dark) !important;
  border-color: var(--ccasign-primary-dark) !important;
}

/* Settings-page selects — daisyUI's `.select` + `.input` combo (which
   `.base-select` extends) centers fine at its natural min-height, but as
   soon as a row forces a fixed height the text drifts up. Lock height +
   line-height + padding to the same scale so the chosen option sits in
   the middle of the box on every browser. */
.cs-centered-select {
  height: 3rem !important;
  min-height: 3rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 3rem !important;
}

/* Sticky chrome — pin the top navbar and the settings sidebar while the
   main content scrolls. Tailwind classes added in mounted view overrides
   aren't compiled into DocuSeal's CSS bundle, so we ship the rules here. */
.cs-sticky-navbar {
  position: sticky;
  top: 0;
  z-index: 30;
  background-color: hsl(var(--b1));
}
@media (min-width: 768px) {
  .cs-sticky-sidebar {
    position: sticky;
    top: 6rem;
    align-self: flex-start;
  }
}

/* daisyUI tooltips render at z-index 1 by default, which puts them behind
   the sticky navbar (z-index 30) and the brand logo inside it. Bump the
   tooltip pseudo-elements above any chrome on the page so hover hints on
   the row directly below the logo (Templates/Submissions toggle, template
   show-page action buttons) stay visible. */
.tooltip::before,
.tooltip::after,
.sm\:tooltip::before,
.sm\:tooltip::after {
  z-index: 100 !important;
}

/* Template editor (builder.vue) ships a hardcoded inline orange-seal SVG
   inside #title_container's home-link. The component lives in the compiled
   template_builder bundle, so we hide the SVG and paint the CCASign mark
   onto the anchor via background-image instead. The 68×40 box keeps the
   ccasign_logo.png aspect ratio (450:265) at the original 40px height. */
#title_container a[href="/"] svg {
  display: none;
}
#title_container a[href="/"] {
  display: inline-block;
  width: 68px;
  height: 40px;
  background: url('/ccasign_logo.png') no-repeat center / contain;
}