/* ═══════════════════════════════════════════════════
   fennec_logo.css — подключается в base.html
   Управляет SVG-иконкой во всех трёх контекстах:
   1. .ticker-brand   — тикер (16px)
   2. .form-logo-link — формы login/register/etc (20px)
   3. .wiki-sidebar-logo — wiki sidebar (18px)
═══════════════════════════════════════════════════ */

/* ── SVG BASE ── */
.fennec-svg {
  display: block;
  width: 16px; height: 16px;   /* размер по умолчанию, переопределяется контекстом */
  flex-shrink: 0;
}
.fennec-svg g,
.fennec-svg polygon,
.fennec-svg rect,
.fennec-svg polyline {
  fill: var(--lime);
  transition: fill 0.35s ease;
}

/* ── 1. TICKER BRAND ── */
/* Чёрный блок слева в жёлтой тикер-полосе */
.ticker-brand {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 0 14px;
  height: 100%;
  background: var(--black);
  border-right: 2px solid rgba(200,241,53,0.35);
  flex-shrink: 0;
  text-decoration: none;
  animation: fennec-glow 3s ease-in-out infinite;
  transition: filter 0.3s;
  /* Убираем z-index конфликт с ticker-inner */
  position: relative; z-index: 1;
}
.ticker-brand:hover {
  filter: drop-shadow(0 0 8px rgba(124,92,252,0.7));
  animation: none;
}
.ticker-brand:hover .fennec-svg g,
.ticker-brand:hover .fennec-svg polygon,
.ticker-brand:hover .fennec-svg rect,
.ticker-brand:hover .fennec-svg polyline {
  fill: var(--purple);
}

.ticker-brand-name {
  font-family: 'Space Mono', monospace;
  font-size: 9px; font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--white); white-space: nowrap;
}
.ticker-brand-name em { font-style: normal; color: var(--lime); }

/* ── 2. FORM LOGO (login / register / change_password / identity колонки) ── */
.form-logo-link {
  display: inline-flex; align-items: center; gap: 10px;
  text-decoration: none;
  animation: fennec-glow 3s ease-in-out infinite;
  transition: filter 0.3s;
}
.form-logo-link:hover {
  filter: drop-shadow(0 0 10px rgba(124,92,252,0.65));
  animation: none;
}
.form-logo-link:hover .fennec-svg g,
.form-logo-link:hover .fennec-svg polygon,
.form-logo-link:hover .fennec-svg rect,
.form-logo-link:hover .fennec-svg polyline {
  fill: var(--purple);
}
/* В форме SVG 20px */
.form-logo-link .fennec-svg { width: 20px; height: 20px; }

/* Текст «Fennec» рядом с иконкой */
.form-logo-link > span:first-of-type {
  font-family: 'Space Mono', monospace;
  font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; color: var(--white);
}
.form-logo-link > span:first-of-type em { font-style: normal; color: var(--lime); }

/* Контейнер в шапке формы */
.bs-form-logo {
  margin-bottom: 32px;
}

/* ── 3. WIKI SIDEBAR LOGO ── */
.wiki-sidebar-logo {
  display: inline-flex; align-items: center; gap: 10px;
  text-decoration: none;
  animation: fennec-glow 4s ease-in-out infinite;
  transition: filter 0.3s;
}
.wiki-sidebar-logo:hover {
  filter: drop-shadow(0 0 10px rgba(124,92,252,0.6));
  animation: none;
}
.wiki-sidebar-logo:hover .fennec-svg g,
.wiki-sidebar-logo:hover .fennec-svg polygon,
.wiki-sidebar-logo:hover .fennec-svg rect,
.wiki-sidebar-logo:hover .fennec-svg polyline {
  fill: var(--purple);
}
.wiki-sidebar-logo .fennec-svg { width: 18px; height: 18px; }

.wiki-sidebar-logo-text {
  display: flex; flex-direction: column; gap: 2px;
}
.wiki-sidebar-logo-name {
  font-family: 'Space Mono', monospace;
  font-size: 12px; font-weight: 700;
  letter-spacing: 0.06em; color: var(--white); line-height: 1;
}
.wiki-sidebar-logo-name em { font-style: normal; color: var(--lime); }
.wiki-sidebar-logo-sub {
  font-family: 'Space Mono', monospace;
  font-size: 8px; letter-spacing: 0.2em;
  text-transform: uppercase; color: rgba(242,240,232,0.4); line-height: 1;
}

/* ── GLOW ANIMATION ── */
@keyframes fennec-glow {
  0%, 100% {
    filter: drop-shadow(0 0 5px rgba(200,241,53,0.4))
            drop-shadow(0 0 14px rgba(200,241,53,0.1));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(200,241,53,0.8))
            drop-shadow(0 0 28px rgba(200,241,53,0.25));
  }
}
