/* ================================================================
   WeedFinder — Logo Animation System  (wf-logo-anim.css)
   Effect: slow pulsating green glow only — no float, no 3D, no scan.
   Sizing locked per context so the logo never overflows its container.
   ================================================================ */

/* ── CUSTOM PROPERTIES ──────────────────────────────────────────── */
:root {
    --wf-logo-glow-lo:   rgba(30, 215, 96, 0.28);
    --wf-logo-glow-hi:   rgba(30, 215, 96, 0.72);
    --wf-logo-vb-lo:     rgba(104, 51, 242, 0.28);
    --wf-logo-vb-hi:     rgba(130, 80, 255, 0.70);
    --wf-logo-pulse-dur: 3.8s;
}

/* ── WRAPPER ─────────────────────────────────────────────────────── */
/* overflow:visible is required so the drop-shadow glow is not clipped */
.wf-logo-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: visible !important;
    line-height: 0;
}

/* hide scan span — feature removed */
.wf-logo-scan { display: none !important; }

/* ── BASE IMAGE ─────────────────────────────────────────────────── */
.wf-logo-main {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    flex-shrink: 0;
    animation: wfGlowPulse var(--wf-logo-pulse-dur) ease-in-out infinite;
    will-change: filter;
}

/* ── GLOW KEYFRAMES ─────────────────────────────────────────────── */
@keyframes wfGlowPulse {
    0%, 100% { filter: drop-shadow(0 0 5px var(--wf-logo-glow-lo)); }
    50%       { filter: drop-shadow(0 0 14px var(--wf-logo-glow-hi))
                        drop-shadow(0 0 28px rgba(30, 215, 96, 0.15)); }
}

/* VB-active: violet pulse */
html.wf-vb-active .wf-logo-main {
    animation: wfGlowPulseVB var(--wf-logo-pulse-dur) ease-in-out infinite;
}
@keyframes wfGlowPulseVB {
    0%, 100% { filter: drop-shadow(0 0 5px var(--wf-logo-vb-lo)); }
    50%       { filter: drop-shadow(0 0 14px var(--wf-logo-vb-hi))
                        drop-shadow(0 0 28px rgba(104, 51, 242, 0.14)); }
}

/* ── HOVER: brighten glow only — no movement ─────────────────────── */
.wf-logo-wrap:hover .wf-logo-main {
    animation-play-state: paused;
    filter: drop-shadow(0 0 20px var(--wf-logo-glow-hi))
            drop-shadow(0 0 40px rgba(30, 215, 96, 0.20));
    transition: filter 0.35s ease-out;
}
html.wf-vb-active .wf-logo-wrap:hover .wf-logo-main {
    filter: drop-shadow(0 0 20px var(--wf-logo-vb-hi))
            drop-shadow(0 0 40px rgba(104, 51, 242, 0.18));
}

/* ================================================================
   SIZING PER CONTEXT
   Each value is tuned to the container's header/panel height.
   ================================================================ */

/* ── Left panel — expanded sidebar logo ─────────────────────────── */
.leftpanel_logo .full_logo .wf-logo-main {
    height: 45px;
    width: auto;
    max-width: none;
}

/* ── Left panel — collapsed (icon-only) sidebar ─────────────────── */
.leftpanel_logo .short_logo .wf-logo-main {
    height: 30px;
    width: 30px;
    object-fit: contain;
}

/* ── Dashboard topbar ────────────────────────────────────────────── */
.db-topbar__logo .wf-logo-main {
    height: 28px;
    width: auto;
    max-width: 136px;
}

/* ── Super-admin sidebar ─────────────────────────────────────────── */
.sa-sidebar__logo .wf-logo-main {
    height: 24px;
    width: auto;
    max-width: 126px;
}

/* ── Auth pages (login / register) ──────────────────────────────── */
.wf-auth-logo .wf-logo-main {
    height: 52px;
    width: auto;
    max-width: 220px;
}

/* ── Age-gate popup ──────────────────────────────────────────────── */
.silverbranch-age-checker .wf-logo-main {
    height: 44px;
    width: auto;
    max-width: 180px;
}

/* ── Inline content logos (wade/index body) ──────────────────────── */
.company_info .wf-logo-main,
.silverbranch-age-checker ~ * .wf-logo-main {
    height: 40px;
    width: auto;
}

/* ── REDUCED MOTION ──────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .wf-logo-main,
    html.wf-vb-active .wf-logo-main {
        animation: none;
        filter: drop-shadow(0 0 6px rgba(30, 215, 96, 0.38));
        will-change: auto;
    }
    .wf-logo-wrap:hover .wf-logo-main {
        transition: none;
    }
}