/* ============ Alnotra wordmark — Caret system ============
   Shared by marketing landing, client area, admin. JetBrains Mono
   weight 500 + a blinking teal caret. Colours are driven by theme
   classes (.theme-dark / .theme-light) via CSS variables so the same
   markup works on every surface.

   Respects prefers-reduced-motion — caret stays on (no animation)
   instead of blinking.
   ============================================================ */
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;600&display=swap");

.alnotra-logo {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 500;
  letter-spacing: -.02em;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  line-height: 1;
  color: var(--logo-text, #f4f4f5);
  white-space: nowrap;
}
.alnotra-logo:hover { text-decoration: none; }
.alnotra-logo .caret {
  display: inline-block;
  width: .08em;
  height: .78em;
  background: var(--logo-caret, #5eead4);
  margin-left: .12em;
  border-radius: 1px;
  animation: alnotra-blink 1.1s step-end infinite;
}
@keyframes alnotra-blink {
  0%, 49%   { opacity: 1; }
  50%, 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .alnotra-logo .caret { animation: none; opacity: 1; }
}

/* Default theme: follow Bootstrap/Tabler's data-bs-theme so the mark
   auto-adapts on toggle wherever the partial is dropped without an
   explicit theme override. */
html[data-bs-theme="dark"]  .alnotra-logo { --logo-text: #f4f4f5; --logo-caret: #5eead4; }
html[data-bs-theme="light"] .alnotra-logo { --logo-text: #0a0a0b; --logo-caret: #0d9488; }

/* Explicit override via class — must BEAT the html[data-bs-theme]
   rule above (which has higher natural specificity: html+attr+class
   = 0,2,1 vs plain class = 0,1,0). Using !important is simpler and
   cheaper than chaining duplicate selectors. */
.alnotra-logo.theme-dark  { --logo-text: #f4f4f5 !important; --logo-caret: #5eead4 !important; }
.alnotra-logo.theme-light { --logo-text: #0a0a0b !important; --logo-caret: #0d9488 !important; }
.theme-dark  .alnotra-logo:not(.theme-light) { --logo-text: #f4f4f5 !important; --logo-caret: #5eead4 !important; }
.theme-light .alnotra-logo:not(.theme-dark)  { --logo-text: #0a0a0b !important; --logo-caret: #0d9488 !important; }

/* Size utilities */
.alnotra-logo.sm { font-size: 18px; }
.alnotra-logo.md { font-size: 24px; }
.alnotra-logo.lg { font-size: 32px; }
.alnotra-logo.xl { font-size: 48px; }
