/*
 * UPSEX V339
 * Alineación exclusiva del desplegable MARCAS.
 * No modifica ningún otro módulo.
 */

@media screen and (min-width:768px){

    /*
     * Estructura real confirmada:
     *
     * li.dropdown
     *   a[href="/marcas"]
     *   div.dropdown-menu
     *
     * Se alinea el borde derecho del panel con
     * el borde derecho de la opción MARCAS.
     */
    #upsex-desktop-header-v1
    .upsex-v321-nav
    li.dropdown
    > a[href$="/marcas"]
    + .dropdown-menu.upsex-v332-submenu-real,

    #upsex-desktop-header-v1
    .upsex-v321-nav
    li.dropdown
    > a[href$="/marcas/"]
    + .dropdown-menu.upsex-v332-submenu-real{
        left:auto!important;
        right:0!important;

        margin-left:0!important;
        margin-right:0!important;

        transform:none!important;
        transform-origin:top right!important;

        width:320px!important;
        min-width:300px!important;
        max-width:calc(100vw - 24px)!important;
    }
}

/*
 * En tablet se mantiene dentro del viewport
 * con un ancho ligeramente menor.
 */
@media screen and (min-width:768px) and (max-width:1050px){

    #upsex-desktop-header-v1
    .upsex-v321-nav
    li.dropdown
    > a[href$="/marcas"]
    + .dropdown-menu.upsex-v332-submenu-real,

    #upsex-desktop-header-v1
    .upsex-v321-nav
    li.dropdown
    > a[href$="/marcas/"]
    + .dropdown-menu.upsex-v332-submenu-real{
        width:290px!important;
        min-width:280px!important;
        max-width:calc(100vw - 20px)!important;
    }
}