/* ─────────────────────────────────────────────────────────────────────────────
   TEDUCAS Core — Header Tweaks
   Animación de achicado de logo al hacer scroll sticky (Elementor Sticky)
   
   Soporte para control personalizado via CSS custom properties:
   --teducas-sticky-logo-width: ancho del logo sticky
   --teducas-sticky-logo-height: alto del logo sticky
   --teducas-sticky-logo-object-fit: ajuste del objeto
   --teducas-sticky-logo-transition: duración de la transición
   
   JS-captured base dimensions (set by header-logo-animation.js):
   --teducas-logo-base-width: ancho original del logo
   --teducas-logo-base-height: alto original del logo
   ───────────────────────────────────────────────────────────────────────────── */

/* Logo base: dimensiones explícitas (capturadas por JS) y transición suave.
   Using the JS-captured base dimensions ensures the browser has explicit
   start values for the transition — CSS can't animate from `auto`. */
.elementor-widget-theme-site-logo img,
.site-logo img,
.custom-logo,
.elementor-widget-image img.custom-logo {
    width: var(--teducas-logo-base-width, auto) !important;
    height: var(--teducas-logo-base-height, auto) !important;
    transition: width var(--teducas-sticky-logo-transition, 0.3s) ease,
                height var(--teducas-sticky-logo-transition, 0.3s) ease,
                max-width var(--teducas-sticky-logo-transition, 0.3s) ease,
                object-fit var(--teducas-sticky-logo-transition, 0.3s) ease !important;
}

/* Logo sticky: aplicar dimensiones personalizadas.
   Fallback to base dimensions ensures the var() never resolves to
   guaranteed-invalid (which happens when --teducas-sticky-logo-width is
   empty/unset, causing the entire declaration to be dropped). */
.elementor-sticky--effects .elementor-widget-theme-site-logo img,
.elementor-sticky--effects .site-logo img,
.elementor-sticky--effects .custom-logo,
.elementor-sticky--effects .elementor-widget-image img.custom-logo {
    width: var(--teducas-sticky-logo-width, var(--teducas-logo-base-width, auto)) !important;
    height: var(--teducas-sticky-logo-height, var(--teducas-logo-base-height, auto)) !important;
    object-fit: var(--teducas-sticky-logo-object-fit, contain) !important;
}