/* ==========================================================================
INICIO SECCIÓN: FIRMA VISUAL FLEX KIDS - SIDEBAR
========================================================================== */

      .aq-flex-kids-sidebar-brand {
         width: 175px;
         max-width: 100%;

         margin: 35px auto 0;

         padding: 14px;

         border-radius: 20px;

         background: rgba(104, 47, 150, 0.035);

         border: 1px solid rgba(104, 47, 150, 0.08);

         box-shadow:
            0 8px 24px rgba(104, 47, 150, 0.06);

         position: relative;

         overflow: hidden;
      }


      /* --------------------------------------------------------------------------
DETALLE DE LUZ
-------------------------------------------------------------------------- */

      .aq-flex-kids-sidebar-brand::before {
         content: "";

         position: absolute;

         width: 90px;
         height: 90px;

         top: -45px;
         right: -30px;

         border-radius: 50%;

         background: rgba(255, 255, 255, 0.10);

         filter: blur(6px);

         pointer-events: none;
      }


      /* --------------------------------------------------------------------------
CONTENEDOR CUADRADO DEL LOGO
-------------------------------------------------------------------------- */

      .aq-flex-kids-sidebar-brand-inner {
         position: relative;

         width: 145px;
         height: 145px;

         margin: 0 auto;

         display: flex;
         align-items: center;
         justify-content: center;

         border-radius: 18px;

         background-color: var(--brand-purple);

         overflow: hidden;

         box-shadow:
            0 10px 24px rgba(104, 47, 150, 0.18),
            inset 0 1px 0 rgba(255, 255, 255, 0.14);

         transition:
            transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            box-shadow 0.45s ease;
      }


      /* --------------------------------------------------------------------------
IMAGEN TRANSPARENTE
-------------------------------------------------------------------------- */

      .aq-flex-kids-sidebar-brand-inner img {
         display: block;

         width: 100%;
         height: 100%;

         object-fit: contain;

         user-select: none;
         -webkit-user-drag: none;

         filter:
            drop-shadow(0 6px 12px rgba(0, 0, 0, 0.12));

         transition:
            transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
      }


      /* --------------------------------------------------------------------------
HOVER
-------------------------------------------------------------------------- */

      .aq-flex-kids-sidebar-brand:hover .aq-flex-kids-sidebar-brand-inner {
         transform: translateY(-5px);

         box-shadow:
            0 15px 30px rgba(104, 47, 150, 0.25),
            inset 0 1px 0 rgba(255, 255, 255, 0.16);
      }

      .aq-flex-kids-sidebar-brand:hover .aq-flex-kids-sidebar-brand-inner img {
         transform:
            translateY(-3px) scale(1.035);
      }


      /* --------------------------------------------------------------------------
TABLET
-------------------------------------------------------------------------- */

      @media (max-width: 1199.98px) {

         .aq-flex-kids-sidebar-brand {
            width: 165px;
            padding: 12px;
         }

         .aq-flex-kids-sidebar-brand-inner {
            width: 139px;
            height: 139px;
         }

      }


      /* ==========================================================================
FIN SECCIÓN: FIRMA VISUAL FLEX KIDS - SIDEBAR
========================================================================== */


      /* Elimina la restricción de altura y la barra de scroll del sidebar */
      .aq-product-sidebar-wrap,
      .aq-product-sidebar-widget-content,
      .aq-product-sidebar-widget-categories {
         max-height: none !important;
         height: auto !important;
         overflow: visible !important;
      }

      /* Permite que las listas y sublistas fluyan naturalmente hacia abajo */
      .aq-product-sidebar-widget-categories ul,
      .aq-product-sidebar-widget-categories ul li ul {
         max-height: none !important;
         overflow: visible !important;
      }



      /* ==========================================================================
INICIO SECCIÓN: IDENTIDAD Y ANIMACIÓN FLEX KIDS
========================================================================== */


      /* ==========================================================================
HEADER DE IDENTIDAD DE COLECCIÓN
========================================================================== */

      .aq-collection-header {
         width: 100%;
      }

      .aq-collection-identity {
         display: flex;
         align-items: stretch;
         gap: 14px;

         position: relative;
      }


      /* ==========================================================================
TARJETA DEL LOGO
========================================================================== */

      .aq-collection-logo-card {
         position: relative;

         flex: 0 0 125px;

         width: 125px;
         height: 125px;

         display: flex;
         align-items: center;
         justify-content: center;

         padding: 8px;

         border-radius: 20px;

         background: rgba(255, 255, 255, 0.42);

         border: 1px solid rgba(255, 255, 255, 0.72);

         box-shadow:
            0 8px 24px rgba(43, 23, 57, 0.07),
            inset 0 1px 0 rgba(255, 255, 255, 0.82);

         backdrop-filter: blur(12px);
         -webkit-backdrop-filter: blur(12px);

         overflow: hidden;

         z-index: 2;

         transition:
            transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
            box-shadow 0.4s ease;
      }


      /* --------------------------------------------------------------------------
CONTENEDOR MORADO

El contenedor existe desde el inicio,
pero el logo permanece oculto hasta el aterrizaje.
-------------------------------------------------------------------------- */

      .aq-collection-logo-inner {
         position: relative;

         width: 109px;
         height: 109px;

         display: flex;
         align-items: center;
         justify-content: center;

         border-radius: 17px;

         background-color: var(--brand-purple);

         overflow: hidden;

         box-shadow:
            0 8px 20px rgba(104, 47, 150, 0.17),
            inset 0 1px 0 rgba(255, 255, 255, 0.14);

         opacity: 0;
         visibility: hidden;

         transform:
            scale(0.82);

         transition:
            opacity 0.55s ease,
            visibility 0.55s ease,
            transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
            box-shadow 0.4s ease;
      }


      /* --------------------------------------------------------------------------
LOGO REVELADO DESPUÉS DEL ATERRIZAJE
-------------------------------------------------------------------------- */

      .aq-collection-logo-card.is-landed .aq-collection-logo-inner {
         opacity: 1;
         visibility: visible;

         transform:
            scale(1);
      }


      /* --------------------------------------------------------------------------
IMAGEN DEL LOGO
-------------------------------------------------------------------------- */

      .aq-collection-logo-inner img {
         display: block;

         width: 100%;
         height: 100%;

         object-fit: contain;

         user-select: none;
         -webkit-user-drag: none;

         filter:
            drop-shadow(0 5px 12px rgba(0, 0, 0, 0.10));

         transform-origin: center center;
      }


      /* ==========================================================================
EFECTO DE ATERRIZAJE
========================================================================== */

      .aq-collection-logo-card::after {
         content: "";

         position: absolute;

         left: 50%;
         top: 50%;

         width: 72px;
         height: 72px;

         border-radius: 50%;

         background:
            rgba(104, 47, 150, 0.13);

         filter: blur(15px);

         transform:
            translate(-50%, -50%) scale(0.35);

         opacity: 0;

         pointer-events: none;

         z-index: -1;
      }


      .aq-collection-logo-card.is-landed::after {
         animation:
            aqFlexKidsLandingGlow 1.05s ease-out forwards;
      }


      @keyframes aqFlexKidsLandingGlow {

         0% {
            opacity: 0;

            transform:
               translate(-50%, -50%) scale(0.35);
         }

         35% {
            opacity: 0.85;

            transform:
               translate(-50%, -50%) scale(1.15);
         }

         100% {
            opacity: 0;

            transform:
               translate(-50%, -50%) scale(1.55);
         }

      }


      /* ==========================================================================
HOVER DEL LOGO
========================================================================== */


      /* La tarjeta responde ligeramente */

      .aq-collection-logo-card.is-landed:hover {
         transform:
            translateY(-4px);

         box-shadow:
            0 14px 30px rgba(43, 23, 57, 0.10),
            inset 0 1px 0 rgba(255, 255, 255, 0.90);
      }


      /* El movimiento juguetón ocurre una sola vez por entrada del cursor */

      .aq-collection-logo-card.is-landed:hover .aq-collection-logo-inner img {
         animation:
            aqFlexKidsHello 0.95s cubic-bezier(0.16, 1, 0.3, 1) 1;
      }


      @keyframes aqFlexKidsHello {

         0% {
            transform:
               translateY(0) rotate(0deg) scale(1);
         }

         15% {
            transform:
               translateY(-7px) rotate(-3deg) scale(1.025);
         }

         30% {
            transform:
               translateY(2px) rotate(3deg) scale(1.02);
         }

         45% {
            transform:
               translateY(-5px) rotate(-2deg) scale(1.02);
         }

         60% {
            transform:
               translateY(1px) rotate(2deg) scale(1.01);
         }

         78% {
            transform:
               translateY(-2px) rotate(-1deg) scale(1.005);
         }

         100% {
            transform:
               translateY(0) rotate(0deg) scale(1);
         }

      }


      /* ==========================================================================
VUELO DE ENTRADA DE LOS ANGELITOS
========================================================================== */

      #aq-flex-kids-flight {
         position: fixed;

         left: 0;
         top: 0;

         width: 210px;
         height: 210px;

         z-index: 10001;

         pointer-events: none;

         opacity: 0;
         visibility: hidden;

         will-change:
            transform,
            opacity;
      }


      #aq-flex-kids-flight.is-flying {
         opacity: 1;
         visibility: visible;
      }


      #aq-flex-kids-flight img {
         display: block;

         width: 100%;
         height: 100%;

         object-fit: contain;

         user-select: none;
         -webkit-user-drag: none;

         filter:
            drop-shadow(0 10px 22px rgba(0, 0, 0, 0.10));
      }


      /* ==========================================================================
CONFETTI
========================================================================== */

      #aq-flex-kids-confetti {
         position: fixed;

         inset: 0;

         width: 100%;
         height: 100%;

         z-index: 10000;

         display: block;

         pointer-events: none;
      }


      /* ==========================================================================
TABLET
========================================================================== */

      @media (max-width: 1199.98px) {

         .aq-collection-logo-card {
            flex-basis: 112px;

            width: 112px;
            height: 112px;
         }

         .aq-collection-logo-inner {
            width: 96px;
            height: 96px;
         }

      }


      @media (max-width: 991.98px) {

         #aq-flex-kids-flight {
            width: 170px;
            height: 170px;
         }

      }


      /* ==========================================================================
MÓVIL
========================================================================== */

      @media (max-width: 575.98px) {

         .aq-collection-identity {
            gap: 10px;
         }

         .aq-collection-logo-card {
            flex-basis: 92px;

            width: 92px;
            height: 92px;

            padding: 6px;

            border-radius: 16px;
         }

         .aq-collection-logo-inner {
            width: 80px;
            height: 80px;

            border-radius: 14px;
         }

         .aq-collection-info-card {
            min-height: 92px;

            padding: 12px 14px;

            border-radius: 16px;
         }

         .aq-collection-info-card .aq-breadcrumb-title {
            font-size: 1.45rem;

            margin-bottom: 5px;
         }

         .aq-collection-info-card .aq-breadcrumb-desc {
            font-size: 0.78rem;
            line-height: 1.4;
         }

         #aq-flex-kids-flight {
            width: 130px;
            height: 130px;
         }

      }


      @media (max-width: 380px) {

         .aq-collection-logo-card {
            flex-basis: 82px;

            width: 82px;
            height: 82px;
         }

         .aq-collection-logo-inner {
            width: 70px;
            height: 70px;
         }

         .aq-collection-info-card {
            padding: 10px 11px;
         }

         .aq-collection-info-card .aq-breadcrumb-title {
            font-size: 1.28rem;
         }

         .aq-collection-info-card .aq-breadcrumb-desc {
            font-size: 0.72rem;
         }

         #aq-flex-kids-flight {
            width: 115px;
            height: 115px;
         }

      }


      /* ==========================================================================
ACCESIBILIDAD
========================================================================== */

      @media (prefers-reduced-motion: reduce) {

         #aq-flex-kids-flight {
            display: none;
         }

         .aq-collection-logo-card.is-landed:hover .aq-collection-logo-inner img {
            animation: none;
         }

         .aq-collection-logo-card.is-landed::after {
            display: none;
         }

      }


      /* ==========================================================================
FIN SECCIÓN: IDENTIDAD Y ANIMACIÓN FLEX KIDS
========================================================================== */